CSS 2.1: `list-style`

Erläuterungen

list-style ist eine Kurzschrift-Eigenschaft, mit der die Art und grafische Darstellung der Markierungen vor einer Aufzählungsliste sowie ihre Einrückung beeinflusst werden kann.

Erlaubte Werte

Auszug aus der Spezifikation (die verwendete Syntax wird im Artikel CSS-Wertesyntax genauer erläutert):

'list-style' [ <list-style-type> || <list-style-position> || <list-style-image> ] | inherit

<list-style-type>: Art des Zählers oder Markierungszeichens vor Aufzählungslisten.
<list-style-position>: Einrückung des Zählers oder Markierungszeichens.
<list-style-image>: Grafik, die ein Markierungszeichen ersetzt.
inherit: Bestimmt explizit, dass diese Eigenschaft denselben berechneten Wert wie im Elternelement annimmt.

Code-Beispiel:

Im folgenden Beispiel werden Kleinbuchstaben dargestellt, falls die Graphik einmal nicht verfügbar sein sollte. Beides wird links nach außerhalb des Blockes geschoben.

OL.la { list-style: lower-alpha outside url(/graphics/x-8-8.gif); }

Mit der folgenden Deklaration geben wir sowohl list-style-type als auch list-style-image den Wert none.

OL.la { list-style: none; }

Browserunterstützung

: Die Eigenschaft list-style wird von allen modernen Browsern unterstützt, auf Einschränkungen wird bei den Einzeleigenschaften hingewiesen.

Eric Meyer's CSS2 Test Suite zeigt am praktischen Beispiel, wie die Browser mit dieser Eigenschaft umgehen.

Keine Eigenschaft und kein Selektor stehen in einem Stylesheet für sich allein. In der Praxis kann das Zusammenspiel zwischen verschiedenen Elementen und Selektoren einen nicht zu unterschätzenden Einfluss auf die Fähigkeiten der Browser haben. Bugs treten oft erst durch das Zusammenwirken mehrerer Eigenschaften an unterschiedlichen Elementen auf.

Wechselwirkungen:

list-style-type, list-style-position, list-style-image

Besonderheiten im Medientyp `handheld`:

Diese Eigenschaft ist Teil des Standards CSS Mobile Profile 1.0 und unterliegt damit auch in Mobilgeräten allen relevanten Regeln aus CSS 2.1.

Weitere Charakteristika:

Die Stylesheet-Schnellreferenz mit einer Zusammenfassung aller visuellen Eigenschaften kann auch als PDF-Datei herunter geladen werden.

Ausgangs- wert:	Berechneter Wert:	Vererbung:	Anwendbar- keit:	%-Bezugs- wert:	Medien- gruppe(n):
Siehe bei den individuellen Eigenschaften	Siehe bei den individuellen Eigenschaften	Ja	Auf Elemente, die als Punkt einer Liste dargestellt werden.	Nicht zutreffend	Visual

Ausblick:

Im geplanten Modul Lists ist mit der Einführung einer Reihe von neuen list-style-types zu rechnen, insbesondere die grafischen Schriften des mittleren und fernen Ostens werden nach dem Willen des W3C Eingang in die Codierung finden. Ebenso wird die Nutzung von Listenmarkierungen genauer beschrieben und vereinfacht werden.