|
XHTML kennt drei verschiedene Typen von Listen:
- geordnete Listen
- ungeordete Listen
- Definitionslisten
|
 |
Eine geordnete oder ungeordnete Liste setzt sich jeweils aus einem Listen-Element und mehreren Listen-Einträgen zusammen. Ein Listen-Element darf keinen Text oder andere Elemente enthalten, sondern nur Listen-Einträge.
Jedes Listen-Element erzeugt eine Zeile Abstand zum vorhergehenden Block-Element, jeder Listen Eintrag eine neue Zeile.
Die Attribute type, start und value sollen in XHTML nicht mehr verwendet werden. Stattdessen schreiben Sie Formatanweisungen in CSS.
(vgl. Nicht erlaubte Elemente und Attribute)
ol (ordered list = geordnete Liste)
Das Element ol verwenden Sie für nummerierte Listen.
Standardmäßig werden als Ordnungszeichen arabische Zahlen angezeigt.
Beispiel
Mit CSS können Sie für list-style-type die folgenden Werte einsetzten:
lower-roman: kleine römische Zahlen
upper-roman: große römische Zahlen
lower-alpha: kleine Buchstaben
upper-alpha: große Buchstaben
none: keine Nummerierung
ul (unordered list = ungeordnete Liste)
Mit dem Element ul erzeugen Sie Bullet-Listen (Aufzählungslisten).
Die Standard-Darstellung für die Bullets sind große Punkte.
Beispiel
Mit CSS sind für list-style-type folgende Werte möglich:
disc: große Punkte
circle: Kreise
square: Quadrate
none: keine Bullets
list-style-image erlaubt außerdem die Verwendung eigener Grafiken als Bullets.
Tipp: Nicht alle Browser stellen diese Symbole wie gewünscht dar, Sie müssen also ein wenig experimentieren.
li (list item = Listen-Eintrag)
Listen-Einträge werden vom linken Rand eingerückt dargestellt. Der Abstand vom Rand und der Abstand vom Ordungszeichen zum Text im li-Element wird von den Browsern unterschiedlich angezeigt.
li-Elemente können weitere Listen oder andere Block-Elemente enthalten, jedoch nicht die Elemente h1 bis h6.
Beispiel
Netscape Navigator 4.x unterstützt keine style-Angaben für li. Deshalb ist es günstiger, die Angaben immer für die übergeordneten ol und ul zu schreiben.
Eine Definitionsliste setzt sich aus einem Listen-Element dl und beliebig vielen Begriffen dt mit Beschreibungen dd zusammen.
dl (definition list = Defintionsliste)
dt (definition term = Definitionsbegriff)
dd (definition description = Defintionsbeschreibung)
Das Element dl eignet sich besonders für Glossare und andere erklärende Listen.
dl darf nur die Elemente dt und dd enthalten. dt und dd sollten immer paarweise vorkommen, müssen aber nicht.
dd wird vom Browser unter dt eingerückt dargestellt.
Netscape Navigator 4.x wendet Style-Angaben nicht auf dd und dt an.
Beispiel
Beispiel:
<?xml version="1.0" encoding="ISO-8859-1"
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD/
XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/TR/xhtml1">
<head>
<title>Beispiel
für Listen</title>
</head>
<body>
<p>Nummerierte
Liste</p>
<ol>
<li>Eintrag</li>
<li>Eintrag</li>
<li>Eintrag</li>
</ol>
<p>Bullet-Liste</p>
<ul>
<li>Eintrag</li>
<li>Eintrag</li>
<li>Eintrag</li>
</ul>
<p>Bullet-Liste mit untergeordneter
Liste</p>
<ul>
<li>Eintrag</li>
<li>Eintrag, enthält nummerierte
Liste </li>
<ol>
<li>Eintrag</li>
<li>Eintrag</li>
<li>Eintrag</li>
</ol>
<li>Eintrag</li>
<li>Eintrag</li>
</ul>
<p>Definitionsliste</p>
<dl>
<dt>Definitionsbegriff</dt>
<dd>Definitionstext</dd>
<dt>Definitionsbegriff</dt>
<dd>Definitionstext</dd>
<dt>Definitionsbegriff</dt>
<dd>Definitionstext</dd>
</dl>
</body>
</html>
Beispiel im Browser anzeigen
|