li


<li> </li>
<ol> </ol>
<ul> </ul>


Einrücken der ul/ol entfernen
padding-left: 0;


list-style-type: disc | circle | square | decimal | decimal-leading-zero | lower-roman | upper-roman | lower-greek | lower-latin | upper-latin | armenian | georgian | lower-alpha | upper-alpha | none


individuelle Punkte via content

list-style-image: url('Dateiname.gif');

list-style-position: outside | inside (ol oder ul ansprechen)

  1. inside
  1. outside


::marker ol li::marker (es muss li angesprochen werden)

  1. Gurken
  2. Äpfel
  3. Weintrauben
  1. Gurken
  2. Äpfel
  3. Weintrauben
  1. Gurken
  2. Äpfel
  3. Weintrauben



::marker besondere Zählungsdarstellung auch ohne Listen
Das zu zählende Element: counter-increment: zähler (Erhöht den Zählwert der "Variable": zähler); display: list-item; ggf. margin-left;
Element::marker: content: "counter(zähler) (Funktion des Zählens)";
Kombinationen möglich: counter(zähler, upper-roman)

Gurken

Äpfel

Weintrauben




counter Etwas komplexer mit counter vs. counters

counter-reset: counter - Erstellt einen Zähler namens counter
counter-increment: counter - Erhöht den Zählwert von counter
content - Ermöglicht das Hinzufügen von Inhalt
counter() or counters() Funktion, die die Zählung einem Element zuweist

Es müssen keine Listen für diese Counter verwendet werden.
Wir geben zuerst dem parent-Element einen counter-reset: menu;
Dann dem Element des Unterpunkts counter-reset: submenu;
h1::before {counter-increment: menu; content: counter(menu)
h2::before {counter-increment: submenu; content: counter(menu)"."counter(submenu)

Menü

Unterpunkt

Unterpunkt

Menü

Unterpunkt

Unterpunkt

Menü

Unterpunkt

Unterpunkt




counters Etwas automatisieren mit counters
Diesmal als Liste (für ol oder ul entscheiden)
ol: counter-reset: zähler; & Listenpunkte entfernen
li::before {counter-increment: zähler; content: counters(zähler,".");
  1. Eintrag
  2. Eintrag
    1. Eintrag
    2. Eintrag
    3. Eintrag
      1. Eintrag
      2. Eintrag
      3. Eintrag
        1. Eintrag
        2. Eintrag
    4. Eintrag
  3. Eintrag
  4. Eintrag