zpět na začátek

7. Seznamy

Cíle kapitoly

Po nastudování této kapitoly dokážeme podle potřeby vytvořit číslovaný, nečíslovaný seznam nebo seznam definic. Budeme vědět, jakým způsobem lze u číslovaného a nečíslovaného seznamu změnit styl odrážek nebo čísel.

Úvod

Při tvorbě seznamu je důležité předem zvolit, zda chceme jednotlivé položky automaticky očíslovat nebo se spokojíme s odrážkami.

Druhy seznamů

Běžně se používají dva druhy seznamů, které se liší úvodním párovým tagem, podle kterého zvolíme, zda chceme použít číslovaný nebo nečíslovaný seznam.

Jednotlivé položky seznamu vytvoříme pomocí párového tagu <li> </li>

Číslovaný (seřazený) seznam

Vyznačuje se automaticky vytvořeným číslováním.

Uvedeme jej párovým tagem <ol> </ol> (z anglického Ordered List = seřazený seznam).

<ol>
  <li>Mléko</li>
  <li>Maso</li>
  <li>Vejce</li>
  <li>Chléb</li>
</ol>
náhled

Styl odrážek (číslování) můžeme změnit pomocí atributu type=““ a hodnot

  • 1 (arabské číslice)
  • a (malá písmena)
  • A (velká písmena)
  • i (malé římské číslice)
  • I (velké římské číslice)

Nečíslovaný (neseřazený) seznam

Pro nečíslovaný seznam zvolíme párový tag <ul> </ul> (z anglického Unordered List = neseřazený seznam).

<ul type="square">
  <li>Mléko</li>
  <li>Maso</li>
  <li>Vejce</li>
  <li>Chléb</li>
</ul>
náhled

Styl odrážek můžeme změnit pomocí atributu type=““ a hodnot

  • disc (puntík)
  • circle (kruh)
  • square (čtverec)

* Existuje ještě třetí druh seznamu, tzv. seznam definic.

Seznam definic

Používá se např. pro slovník pojmů.

Označuje se pomocí párového tagu <dl> </dl> (Definition List = seznam definic) a nemá další atributy.

Položky seznamu definic
  • <dt> </dt> - definovaný termín
  • <dd> </dd> - definice termínu
<dl>
  <dt>SPZ</dt>
  <dd>Státní poznávací značka</dd>
  <dt>ČNB</dt>
  <dd>Česká národní banka</dd>
</dl>
náhled

Shrnutí

Naučili jsme se vytvářet číslované a nečíslované seznamy, seznamy definic. Umíme změnit styl odrážek.

Poznali jsme tyto párové tagy: <ol>, <ul>, <li>, <dl>, <dt>, <dd>

Poznali jsme tento atribut: type=""

Úkol

K původnímu úkolu přidej číslovaný seznam o 5 položkách seřazených podle oblíbenosti (např. oblíbené sporty). Vytvoř nečíslovaný seznam se jmény členů tvé rodiny a změň styl odrážek na kruh. Vytvoř seznam definic, zvol si zkratku nebo termín a ten následně definuj.