Wiecie, co bardzo lubię? Listy!

Spisywaliście listę zakupów,
rzeczy do zrobienia?

Czytaliście listę na stronie www,

np. „10 najśmieszniejszych
psich pysków?”.

Z pewnością. Świat jest pełen list!

HTML udostępnia nam znaczniki
do sporządzania list.

Wypróbujemy je, spisując powody,

dla których króliki są świetnymi
zwierzątkami domowymi.

Żeby rozpocząć listę punktowaną,

wstawimy znacznik „ul”.

Od czego to skrót?

Zgadniecie, że „l” oznacza listę.

„U” to „nieuporządkowana”
(ang. unordered).

Przeglądarka nie ponumeruje
elementów listy.

Tylko wstawi z przodu kółeczka.

Pokażę wam o co chodzi.
Wstawiamy pierwszy punkt,

„są puchate”.

Widzicie kółeczko z boku?

To jest punktor.

Jak myślicie, co oznacza „li”?

„L” to lista,
a „i” - element (ang. item).

Chcąc dodać nowy element,

wstawiamy
nowy znacznik „li” w „ul”.

Każdy „ul” musi zawierać
co najmniej jeden „li”,

bo lista bez elementów
byłaby nieciekawa!

Dodajmy coś jeszcze.

„Umieją słuchać”

i „zawsze zjedzą marchewkę,
która wam zostanie”.

Całkiem przekonująca lista.

Po jej przeczytaniu
nie można nie chcieć królika!

Nie ponumerowałam elementów,

bo żaden powód

nie jest ważniejszy od innych,

często jednak potrzebujemy
listy numerowanej.

Zróbmy np. listę

„Trzy najsławniejsze króliki”.

Lista numerowana zacznie się

od znacznika „ol” zamiast „ul” .

Domyślacie się, skąd „ol”?

Podpowiem: to przeciwieństwo

słowa nieuporządkowany
(unordered) w znaczniku „ul”.

Tak, to lista uporządkowana
(ang. ordered).

Znacznik każe przeglądarce

automatycznie numerować elementy.

Aby dodać element,
nadal wpisujemy „li”

w środku listy.

Wpiszemy Królika Bugsa,

Tuptusia

i, rzecz jasna,
zajączka wielkanocnego.

Ta lista ma dużą zaletę:

przeglądarka
numeruje elementy za nas.

Gdy przestawimy,
usuniemy lub dodamy elementy,

numeracja zostanie skorygowana.

Kiedy powiecie,

że nie znacie Tuptusia,

najpierw wyślę was do kina

na „Jelonka Bambi”,

ale zaraz, choć niechętnie,

przesunę Tuptusia na koniec.

Biedak jest teraz numerem 3.

Teraz macie już narzędzia
do tworzenia list.

Możecie tworzyć listy
wszystkiego, co się da!