HTML/Tutorials/Listen/Aufzählungslisten
Es gibt zwei Arten von Aufzählungslisten, sortierte und unsortierte. Sie unterscheiden sich nur durch den Namen des Elternelements und können miteinander kombiert werden:
Inhaltsverzeichnis
ul
Das Element ul, unordered list (englisch für ungeordnete, unsortierte Liste), beschreibt eine Liste, bei der die Reihenfolge der Elemente nur eine untergeordnete oder keine Rolle spielt.
Aufzählungslisten sind z. B. von Bedeutung, um Produkteigenschaften oder Argumente für eine These übersichtlich darzustellen. Bei einer Aufzählungsliste werden die Listeneinträge von grafischen Browsern standardmäßig mit einem Aufzählungszeichen (Bullet) versehen. Aufzählungslisten eignen sich sehr gut, um Navigationsleisten in Webseiten zu strukturieren.
<ul> leitet eine Aufzählungsliste ein.
Mit <li> beginnt ein neuer Punkt innerhalb der Liste (li = list item = Listeneintrag).
</li> beendet den Listeneintrag, </ul> die Liste.
Wie das Aufzählungszeichen (Bullet) dargestellt wird, bestimmt dabei der Browser. Dessen Darstellung kann jedoch mit list-style-type beeinflusst werden.
Listen verschachteln
Das Verschachteln von Listen ist ebenfalls möglich. Zwischen <li> und </li> darf eine komplette weitere Liste stehen. Auch andere Listentypen sind dabei erlaubt.
Nach dem Text „Suchmaschinen“ sowie „Verzeichnisse“ wird das begonnene <li> zunächst nicht geschlossen. Stattdessen folgen unmittelbar die inneren Listen (grün dargestellt). Erst danach kommt das schließende </li> .
ol
Das Element ol, ordered list (englisch für geordnete, sortierte Liste), bezeichnet eine Liste, bei der die Reihenfolge der Elemente von Bedeutung ist.
Nummerierung beeinflussen
Sie können den Startwert einer Liste festlegen und bei einem beliebigen Listenelement neu setzen. Dazu nutzen Sie das Attribut start des ol-Elementes. Erlaubte Werte für dieses Attribut sind ganze Zahlen. Um die Nummerierung in der Liste zu ändern, verwenden Sie das Attribut value im li-Element.
Die erste Liste beginnt bei 3 an zu zählen. Die zweite Liste fängt bei 17 an, das zweite Element zählt normal weiter (18). Beim dritten Element geht es mit 4 weiter, da das value-Attribut des li-Elementes gesetzt ist, das vierte Element zählt wieder um eins hoch.
Zählrichtung umkehren
HTML5 ermöglicht es zusätzlich, die Zählrichtung umzukehren wie bei der Bekanntgabe von Gewinnern bei einer Verlosung häufig praktiziert. Für den Startwert wird das start-Attribut des ol-Elementes genutzt, das Rückwärtszählen durch das Attribut reversed veranlasst.
Es kann dabei auf folgende Weise angegeben werden:
-
reversed="reversed" -
reversed="" -
reversed
Die Nummerierung beginnt mit 3 und endet bei 1.
Weblinks
- css-tricks: Ordered Lists with Unicode Symbols
