Nápověda:Seznamy

Tato stránka není ještě hotová.

Seznam sestává z několika položek (items), řazených zpravidla pod sebe

Seznamy jednoduše

MediaWiki poskytuje jednoduchou syntaxi na vytváření seznamů. V zásadě rozlišujeme nečíslovaný seznam a číslovaný seznam, které můžeme prakticky libovolně kombinovat:

Napíšeme	Zobrazí se jako
* ruka * noha * hlava	ruka noha hlava
* ruka ** prsty *** palec *** ukazováček *** prostředníček ** zápěstí * noha ** koleno * hlava ** nos ** uši	ruka prsty palec ukazováček prostředníček zápěstí noha koleno hlava nos uši
# ruka ## prsty ### palec ### ukazováček ### prostředníček ## zápěstí # noha ## koleno # hlava ## nos ## uši	ruka prsty palec ukazováček prostředníček zápěstí noha koleno hlava nos uši
# ruka #* prsty #*# první je palec #*# druhý je ukazováček #*# třetí je prostředníček #* zápěstí # noha ## koleno * hlava *# nos *# uši	ruka prsty první je palec druhý je ukazováček třetí je prostředníček zápěstí noha koleno hlava nos uši

Seznamy v HTML

Pokud chceme mít větší kontrolu nad tím, jak se bude seznam zobrazovat, musíme seznam vytvořit pomocí syntaxe HTML. (HTML kód tu pro větší přehlednost zvýrazňujeme barevně – samozřejmě, že při jeho psaní píšeme normálně černobíle.)

Základní syntaxe

Nejdříve (z didaktických důvodů) zkusíme vytvořit pomocí HTML podobné seznamy, které jsme jednoduše vytvářeli už předtím:

Napíšeme	Zobrazí se jako
<ul> <li>ruka <li>noha <li>hlava </ul>	ruka noha hlava
<ol> <li>ruka</li> <li>noha</li> <li>hlava</li> </ol>	první druhý třetí
<ol> <li>ruka</li> <ul> <li>prsty</li> <ol> <li>první je palec</li> <li>druhý je ukazováček</li> <li>třetí je prostředníček</li> <ol> <li>zápěstí</li> </ul> <li>noha</li> </ol>	ruka prsty první je palec druhý je ukazováček třetí je prostředníček zápěstí noha

Odsazení

To, že na začátku odsazujeme HTML značky podobně jako ve výsledném seznamu, má význam pouze v tom, že se budeme v kódu lépe orientovat – my, kteří kód vytváříme i ti, kteří se mu budou snažit porozumět a budou jej nás chtít dále editovat. Ale ať značky kódu umístíme kamkoliv, zobrazí se nakonec stejně:

Napíšeme	Zobrazí se jako
<ol> <li>první</li> <ul> <li>áčko</li> <li>béčko</li> </ul> <li>druhé</li> <ul> <li>áčko</li> <li>béčko</li> </ul> </ol>	první áčko béčko druhé áčko béčko
<ol> <li> první </li> <ul> <li> áčko </li> <li> béčko </li> </ul> <li>druhé</li><ul><li> áčko</li><li> béčko</li></ul></ol>	první áčko béčko druhé áčko béčko

Prvním způsobem zápisu jsme ničeho nedosáhli – odsazení se zobrazuje stále stejně – a druhým vzteklým způsobem zápisu jsme si jej sice nakrásně znepřehlednili, zobrazení však zůstává stále stejné.

Atribut style

Nyní přichází na řadu tzv. atributy, kterými můžeme HTML značky různě "vylepšovat". Atributy píšeme dovnitř HTML značek. Častý je atribut style s příslušnými parametry, kterým můžeme měnit způsob zobrazení podobně, jako u kaskádových stylů CSS.

Paremetrem text-indent můžeme měnit odsazení textu. Typografická jednotka em znamená tzv. čtverčík – zhruba šířku písmene M, které by bylo stejně široké, jako je vysoké (pro větší zřetelnost zkusíme měnit parametr po dvojnásobcích em, tedy 2em, 4em atd.):

Napíšeme	Zobrazí se jako
<ol> <li>první případ</li> <ul> <li>áčko</li> <li>béčko</li> </ul> <li style="text-indent: 2em;">druhý případ</li> <ul style="text-indent: 4em;"> <li>áčko</li> <li style="text-indent: 6em;">béčko</li> <li style="text-indent: 8em;">céčko</li> <li style="text-indent: 0;">déčko</li> </ul> </ol>	první případ áčko béčko druhý případ áčko béčko céčko déčko

Vidíme, že se nám odsadil začátek textu, ale číslování a puntíky nám zůstaly na svých místech. Zkusíme tedy použít parametr padding-left, tj. vyplnění zleva:

Napíšeme	Zobrazí se jako
<ol> <li>první případ</li> <ul> <li>áčko</li> <li>béčko</li> </ul> <li style="padding-left: 2em;">druhý případ</li> <ul style="padding-left: 4em;"> <li>áčko</li> <li style="padding-left: 6em;">béčko</li> <li style="padding-left: 8em;">céčko</li> <li style="padding-left: 0;">déčko</li> </ul> </ol>	první případ áčko béčko druhý případ áčko béčko céčko déčko

Vidíme, že puntíky se nám ve druhém případě posunuly o stejnou vzdálenost (danou parametrem v tagu

<ul>

) a dál se nám už posunoval okraj textu. Zkusíme nyní použít parametr margin-left, tj. levý okraj:

Napíšeme	Zobrazí se jako
<ol> <li>první případ</li> <ul> <li>áčko</li> <li>béčko</li> </ul> <li style="margin-left: 2em;">druhý případ</li> <ul style="margin-left: 4em;"> <li>áčko</li> <li style="margin-left: 6em;">béčko</li> <li style="margin-left: 8em;">céčko</li> <li style="margin-left: 0;">déčko</li> </ul> </ol>	první případ áčko béčko druhý případ áčko béčko céčko déčko