Geordnete Liste (ol)

Beispiel 1

Normal

  1. Punkt
  2. Punkt
  3. Punkt
  1. Punkt
  2. Punkt
  3. Punkt
  1. Punkt
  2. Punkt
  3. Punkt

Quellcode

  <ol>
   <li>Punkt</li>
   <li>Punkt</li>
   <li>Punkt</li>
  </ol>

  <ol class="lower-alpha">
   <li>Punkt</li>
   <li>Punkt</li>
   <li>Punkt</li>
  </ol>

  <ol class="upper-alpha">
   <li>Punkt</li>
   <li>Punkt</li>
   <li>Punkt</li>
  </ol>

Beispiel 2

Verschachtelt

  1. Punkt
  2. Punkt
    1. Punkt
    2. Punkt
    3. Punkt
  3. Punkt

Quellcode:

  <ol>
   <li>Punkt</li>
   <li>Punkt
    <ol>
     <li>Punkt</li>
     <li>Punkt</li>
     <li>Punkt</li>
    </ol>
   </li>
   <li>Punkt</li>
  </ol>

Stylesheet

  /* Ordered List */
  ol {border:1px solid #DDD;width:80px;margin:0 0 5px 0;padding:0 3px;}
  ol li {list-style-position:inside;width:80px;margin:0;padding:0;}
  
  /* Ordered List mit Buchstaben */
  ol.lower-alpha li {list-style-type:lower-alpha;}
  ol.upper-alpha li {list-style-type:upper-alpha;}

  /* Ordered List - verschachtelt */
  ol li ol {border:0;margin:0 0 0 15px;width:60px;}
  ol li ol li {list-style-type:upper-alpha;background:#DDD;width:55px;margin:0 0 1px 0;padding:0 3px;}

Erläuterungen

ol
Geordnete Liste
li
Listen-Element