list-style

(Auszug aus "CSS − Anspruchsvolle Websites mit Cascading Stylesheets" von Rachel Andrew & Dan Shafer)

Die zusammenfassende Eigenschaft list-style können die Listeneigenschaften list-style-image, list-style-position und list-style-type gemeinsam in einer einzigen Anweisung deklariert werden.

Alle drei Angaben sind optional. Eine Eigenschaft, die nicht deklariert wird, wird nach ihrem Standardwert dargestellt.

Diese Eigenschaft führt nur dann zu einem Effekt, wenn die display-Eigenschaft des betreffenden Elements mit list-item deklariert wird. Es wird empfohlen, diese Eigenschaft für die übergeordnete Liste zu deklarieren, sodass die Einstellung an untergeordnete Listen einfach weitervererbt wird.

Vererbt: Ja

Siehe auch: list-style-image, list-style-position und list-style-type

Wert

Die Syntax für die Eigenschaft list-style ist wie folgt aufgebaut. Die Werte werden durch Leerzeichen voneinander getrennt:

list-style: [type] [position] [image]

Die Angabe aller drei Werte ist optional, es muss jedoch mindestens einer vorhanden sein. Als type kann jeder gültige Wert für list-style-type, für position jeder gültige Wert für list-style-position und für image jeder gültige Wert für list-style-image angegeben werden. Die Reihenfolge ist beliebig.

Wenn Werte für type und image angegeben werden, wird auf die Einstellung von type zurückgegriffen, falls das Bild nicht geladen werden kann.

Wird die Eigenschaft mit none deklariert, werden sowohl list-style-image als auch list-style-type auf none gesetzt.

Standardwert: none

Kompatibilität

CSS-Version: 1

Funktioniert in allen CSS-fähigen Browsern.

Netscape 4 unterstützt list-style-image und list-style-position nicht, beide Eigenschaften haben dort keine Auswirkungen.

Beispiel

Folgende Stilregeln legen ein Bild für Listeneinträge in unnummerierten Listen und römische Ziffern für Listeneinträge in nummerierten Listen fest:

Zum gleichen Ergebnis führen die folgenden Stilregeln, solange es nicht zu verschachtelten Listen kommt:

Beim Einsatz verschachtelter Listen kommt es zu Unterschieden mit den beiden Varianten. Nehmen wir etwa eine nummerierte Liste (ol), verschachtelt in einer unnummerierten Liste (ul): Im ersten Beispiel wird die nummerierte Liste korrekt mit römischen Ziffern angezeigt. Im zweiten Beispiel erbt sie jedoch das Bild als Aufzählungszeichen. Im ersten Beispiel passiert das nicht: Die Deklaration list-style: upper-roman führt automatisch dazu, dass list-style-image auf den Standardwert none gesetzt wird, da es nicht extra in der Stilregel deklariert wird.