Listy <ul> oraz <ol>

Artykuł  | Mirosław Zelent

Lista nieuporządkowana (nienumerowana) – z ang. unordered list – jest definiowana przez znacznik <ul></ul>, zaś pojedynczy element takiej listy zamknięty jest w znacznikach <li></li>, od ang. list item:

 <ul>
<li>Królestwa Północy</li>
<li>Scoia'tael</li>
<li>Cesarstwo Nilfgaardu</li>
<li>Skellige</li>
</ul>

Lista uporządkowana (numerowana) – z ang. ordered list – jest definiowana przez znacznik <ol></ol>, zaś pojedynczy element takiej listy również zamknięty jest w znacznikach <li></li>:

 <ol>
<li>Królestwa Północy</li>
<li>Scoia'tael</li>
<li>Cesarstwo Nilfgaardu</li>
<li>Skellige</li>
</ol>

Oczywiście w niektórych przypadkach zajdzie potrzeba tzw. zagnieżdżenia listy, czyli stworzenia listy wewnętrznej wewnątrz znaczników <li></li> listy zewnętrznej. W poniższym przykładzie lista zewnętrzna to lista numerowana, a wewnętrzna to lista nienumerowana (choć równie dobrze można by zagnieździć je odwrotnie):

 <ol>
<li>Królestwa Północy
<ul>
<li>Sigismund Dijkstra</li>
<li>Keira Metz</li>
</ul>
</li>
<li>Scoia'tael
<ul>
<li>Iorveth</li>
<li>Isengrim Faoiltiarna</li>
</ul>
</li>
</ol>

Listy to ważne znaczniki HTML w kontekście egzaminu zawodowego – często pojawiają się tak w części pisemnej jak i w zadaniach praktycznych, jak również są ważne w pracy. Często na odpowiednio wystylizowanych listach buduje się menu główne witryny – pomimo, iż takie górne menu wygląda jak pozioma belka, to kiedy zajrzymy do jej trzewi, okazuje się że od strony mechaniki wszystko zbudowane jest na kanwie właśnie listy zagnieżdżonej.

Komentarze

Czy macie jakieś uwagi, pytania, sugestie? A może zauważyliście literówkę albo błąd? Dajcie koniecznie znać w komentarzach. Dziękujemy Wam za poświęcony czas!