HTML-Befehle

Um HTML in Verbindung mit den Cascading Stylesheets optimal zu nutzen, empfiehlt es sich, logische Auszeichnungsbefehle den optischen vorzuziehen. Im folgenden werden einige Umgebungen aufgezählt:

<h1>...</h1>

erzeugt eine Überschrift erster Ordnung (heading 1), was normalerweise nur als Seitentitel verwendet wird.

<h2>...</h2>

erzeugt eine Überschrift zweiter Ordnung (heading 2), was für normale Überschriften gebraucht wird.

<p>...</p>

schließt einen Absatz (paragraph) ein, der meist durch eine Leerzeile vom übrigen Text getrennt wird.

<a href="dateiname.html">...</a>

erstellt einen Link (anchor), der auf eine Datei verweist, die im selben Verzeichnis liegt.

<a href="http://www.website.de">...</a>

erstellt einen Link (anchor), der auf eine andere Website verweist.

<b>...</b>

erzeugt fettgedruckten Text (bold) für Hervorhebungen.

<i>...</i>

erzeugt schräggestellten Text (italic) für Betonungen.

Aufzählungen, als Stichpunktlisten und durchnummerierte Listen, sind schwieriger zu realisieren. Zuerst muss definiert werden, welche Liste gewählt wird. Die einzelnen Listenpunkte werden dann einzeln markiert.

<ul>...</ul>

ist eine unnummerierte Liste (unorder list), die die einzelnen Aufzählungspunkte umschließt.

<ol>...</ol>

ist eine geordnete (durchnummerierte) Liste (order list), die die einzelnen Aufzählungspunkte umschließt.

<li>...</li>

umschließt einen Aufzählungspunkt (list item), vor den dann je nach Umgebung eine Zahl oder ein Stichpunkt gesetzt wird.

Außerdem gibt es noch Befehle, die nicht als Umgebung gebraucht werden und daher nicht geschlossen werden müssen:

<img src="bild.jpg" />

bindet eine Bilddatei ein, die im selben Verzeichnis liegt.

<link rel="stylesheet" type="text/css" href="/styles/ag-bg.css" />

bindet eine Formatvorlage in die eigene Datei ein. Dieser Befehl wird nur im head der Seite benutzt.

Eine etwas kompliziertere HTML-Datei könnte also folgendermaßen aussehen:

<html> <head> <title>Beipiel</title> <link rel="stylesheet" href="http://www.solar-cafe.net/midgreen.css" /> </head> <body> <h1>Eine Beispieldatei</h1> <p>Hier steht der Text, der im Browser erscheinen soll. Er wird als ein Absatz gesetzt. Eine andere Seite ist <a href="andere.html">hier</a></p> </body> </html>