ol

Podsumowanie

Element <ol> (ordered list) jest używany do definiowania uporządkowanej lub numerowanej listy punktów. Styl numerowania pojawia się w różnych formach, włączając w to litery, cyfry rzymskie i normalne liczby. Poszczególne punkty w liście są określane przez elementy pozycja listy (<li>), objęte elementem <ol>.

• Typ elementu: blokowy
• Dozwolona zawartość: li

Atrybuty

start

Określa początkową wartość dla numerowania poszczególnych punktów listy. Chociaż typ porządkowania listy elementów może być cyframi rzymskimi, jak XXXI, lub literami, wartość start jest zawsze reprezentowana jako liczba. By rozpocząć numerowanie elementów od litery "C", użyj <ol type="A" start="3">.

type

Wskazuje typ numerowania: a określa małe litery, A wskazuje duże litery, i określa małe cyfry rzymskie, I określa duże cyfry rzymskie, zaś 1 określa liczby. Atrybut type ustawiony w elemencie <ol> jest używany wewnątrz listy, chyba że atrybut type jest użyty w zamkniętym elemencie <li>. Ten atrybut jest wycofywany, użyj zamiast niego własności CSS list-style-type.

compact

Wskazuje, że lista powinna być wyświetlona w zwartej formie. Interpretacja tego atrybutu zależy od programu użytkownika. Nie działa on we wszystkich wiodących przeglądarkach.

Przykłady

Prosty przykład

  <ol>
    <li>pierwsza pozycja</li>
    <li>druga pozycja</li>
    <li>trzecia pozycja</li>
  </ol>

Powyższy HTML daje w efekcie:

1. pierwsza pozycja
2. druga pozycja
3. trzecia pozycja

Użycie własności start

  <ol start="7">
    <li>pierwsza pozycja</li>
    <li>druga pozycja</li>
    <li>trzecia pozycja</li>
  </ol>

Powyższy HTML daje w efekcie:

7. pierwsza pozycja
8. druga pozycja
9. trzecia pozycja

Zagnieżdżona lista

  <ol>
    <li>pierwsza pozycja</li>
    <li>druga pozycja      <!-- Spójrz, zamykający znacznik </li> nie jest tutaj umieszczony -->
      <ol>
        <li>druga pozycja pierwszy podpunkt</li>
        <li>druga pozycja drugi podpunkt</li>
        <li>druga pozycja trzeci podpunkt</li>
      </ol>
    </li>                <!-- Tutaj jest zamykający znacznik </li> -->
    <li>trzecia pozycja</li>
  </ol>

Powyższy HTML daje w efekcie:

1. pierwsza pozycja
2. druga pozycja
   1. druga pozycja pierwszy podpunkt
   2. druga pozycja drugi podpunkt
   3. druga pozycja trzeci podpunkt
3. trzecia pozycja

Zagnieżdżanie <ol> oraz <ul>

  <ol>
    <li>pierwsza pozycja</li>
    <li>druga pozycja      <!-- Spójrz, zamykający znacznik </li> nie jest tutaj umieszczony -->
      <ul>
        <li>druga pozycja pierwszy podpunkt</li>
        <li>druga pozycja drugi podpunkt</li>
        <li>druga pozycja trzeci podpunkt</li>
      </ul>
    </li>                <!-- Tutaj jest zamykający znacznik </li> -->
    <li>trzecia pozycja</li>
  </ol>

Powyższy HTML daje w efekcie:

1. pierwsza pozycja
2. druga pozycja
   • druga pozycja pierwszy podpunkt
   • druga pozycja drugi podpunkt
   • druga pozycja trzeci podpunkt
3. trzecia pozycja

Notatki

Możesz zagnieżdżać tak dużo list <ul> i <ol>, jak chcesz w dowolnej kolejności.

Aby zmienić wcięcie listy, użyj własności CSS margin.

Zobacz także

• Znacznik li (pozycja listy)
• Znacznik ul (lista nieuporządkowana)
• Własność CSS list-style
• Liczniki CSS