PROTI jazyk HTML pro prezentaci informací ve formě seznamů je k dispozici speciální sada značek. Seznamy jsou jednou z nejpoužívanějších forem prezentace dat jako např elektronické dokumenty a v tisku. Se seznamy se setkáváme téměř denně – může to být seznam nezbytných nákupů v obchodě, studentů ve třídě, nebo jen věcí, které je potřeba vyřídit. Schopnost organizovat struktury seznamu je k dispozici v mnoha textové editory zejména výkonný textový procesor Microsoft Word má pohodlné nástroje pro formátování seznamů různých typů (možnost vytvářet seznamy HTML, když Nápověda společnosti Microsoft Slovo Word je probráno v kapitole 8.) Zde je několik případů, pro které je použití seznamů docela vhodné:
- Kombinace částí informací do jediné struktury, která poskytuje čitelný vzhled.
- Popis složitých procesů krok za krokem.
- Umístění informací ve stylu obsahu, jehož odstavce označují odpovídající části dokumentu.
Všimněte si, že výše uvedené položky jsou uspořádány pouze ve formě struktury seznamu.
HTML poskytuje následující základní typy seznamů: seznam s odrážkami, číslovaný seznam a seznam definic. K implementaci seznamů různých typů se používají následující značky:
- ,
- (LI - Položka seznamu). Štítek
- nepotřebuje vhodný koncový štítek, i když jeho přítomnost v zásadě není zakázána. Prohlížeče obvykle při zobrazení dokumentu začínají každou novou položku seznamu na novém řádku.
Poskytnuté informace stačí k vytvoření základního seznamu s odrážkami. Zde je příklad dokumentu HTML, který používá seznam s odrážkami, který se zobrazí v prohlížeči, jak je znázorněno na obr. 2.1.
Příklad seznamu odrážek - Beran
- Býk
- Dvojčata
- Rakovina
- Lev
- Panna
- váhy
- Štír
- Střelec
- Kozoroh
- Vodnář
- Ryby
Znamení zvěrokruhu:
Rýže. 2.1. Zobrazení seznamu s odrážkami v prohlížeči
Všimněte si, že kromě položek seznamu označených tagem
- , mohou být přítomny další prvky HTML. Ve výše uvedeném příkladu je jedním z těchto prvků prostý text, který není položkou seznamu, ale hraje roli jeho nadpisu.
Poznámka
Některé učebnice HTML vás instruují, abyste k nastavení názvu seznamu použili kontejner značek.
(LH - Záhlaví seznamu, záhlaví seznamu). Tuto značku v současné době nerozpozná žádný z běžných prohlížečů a není součástí specifikace HTML. Jeho aplikace tak ztrácí smysl, ačkoli nepovede k žádným chybám. Ve štítku
- lze zadat dva parametry: COMPACT a TYPE.
- .
Příklad nahrávání:
-
.
Poznámka
Prohlížeče interpretují zadání typu značky odlišně individuální prvek seznam. Prohlížeč Netscape změní typ značky pro tuto a všechny následující, dokud nenarazí na další přepsání typu značky. internetový prohlížeč Průzkumník změní pohled na značku pouze pro tohoto prvku.
Grafické značky seznamu
Grafiku lze použít jako značky seznamu, což se široce používá k vytváření atraktivních, krásně navržených dokumentů HTML. Ve skutečnosti takovou možnost neposkytuje přímo jazyk HTML, ale je implementována poněkud uměle. To neznamená, že se to nedoporučuje nebo zavrženíhodné, ale pouze to znamená, že zde nebudou použity žádné speciální konstrukce jazyka HTML.
Abyste pochopili myšlenku, musíte pochopit, jak jsou seznamy implementovány na stránkách HTML. Ukazuje se, že značka seznamu
- (stejně jako mimochodem značky jiných typů seznamů zvažovaných níže) plní jediný úkol - říká prohlížeči, že všechny informace umístěné za touto značkou by se měly zobrazovat s posunem doprava (odsazeny) o určitou hodnotu. Tagy
- které ukazují na jednotlivé položky seznamu, poskytují standardní značky položek seznamu.
Pokud potřebujeme vytvořit seznam s grafickými značkami, pak se bez značek zcela obejdeme.
- ... Bude stačit vložit požadovaný grafický obrázek před každý prvek seznamu. Jediný problém, který je v tomto případě potřeba vyřešit, bude oddělit prvky seznamu od sebe. K tomu můžete použít značky odstavce
Nebo nucený posuv řádku
... Příklad implementace seznamu s grafickými značkami, jehož zobrazení je na Obr. 2.2 je zobrazen níže:Seznam s odrážkami Znamení zvěrokruhu:
Beran
Rýže. 2.2. Seznam odrážek s grafickými značkami
V uvedeném příkladu je jako značka položek seznamu použit grafický soubor Green_ball.gif. Pamatujte, že použití grafiky na stránkách HTML může výrazně zvýšit množství přenášených informací. Nicméně, v v tomto případě tento nárůst je extrémně nevýznamný. Zde se pro všechny značky používá stejný soubor,
který bude vysílán pouze jednou. Velikost souboru obsahujícího malý obrázek je také extrémně malá.
Poznámka
Metody vytváření seznamů s grafickými značkami jsou postupně popsány v kapitole 8.
Číslovaný seznam
Dalším typem seznamů implementovaným v HTML je číslovaný seznam. Jinak se seznamy tohoto typu nazývají uspořádané. Posledně jmenovaný název se často používá jako formální překlad názvu odpovídajícího tagu.
- , s jehož pomocí jsou seznamy tohoto typu organizovány v HTML dokumentech (OL - Ordered List).
- .
Zde je příklad dokumentu HTML pomocí číslovaného seznamu, jehož displej prohlížeč je znázorněn na obr. 2.3.
Příklad číslovaného seznamu - Sírius
- Do anopusu
- Arcturus
- Alfa Centauri
- Vega
- K apella
- Rigel
- Procyon
- Achernar
- Beta Centauri
- Vetelgeuse
- Aldebaran
. . .- Mizar
. . .- Polární
Nejjasnější hvězdy viditelné ze Země:
Rýže. 2.Z.Číslovaný seznam
Ve štítku
- lze zadat následující parametry: COMPACT, TYPE a START.
- .
Příklad nahrávání:
- .
Parametr START tag
- umožňuje začít číslovat seznam s jinou než jedna. Jako hodnota parametru START musí být vždy uvedeno přirozené číslo bez ohledu na typ číslování seznamů. Uveďme příklad:
- pro číslované seznamy umožňuje použití parametrů TYPE a VALUE. Parametr TYPE může nabývat stejných hodnot jako pro tag.
- .
- .
Poznámka
Prohlížeče interpretují zadání typu číslování pro jednotlivé položky seznamu odlišně. Prohlížeč Netscape změní číslování tohoto prvku a všech následujících, dokud nenarazí na další přepsání. Internet Explorer změní vzhled čísla pouze u této položky.
Zhodnotu parametru VALUE značky
- - umožňuje změnit číslo této položky seznamu. Tím se také změní číslování všech následujících prvků. Typickými aplikacemi jsou seznamy s vynecháním určitých prvků. Příklad takového seznamu byl uveden výše (obr. 2.3). Uvádí seřazený seznam nejjasnějších hvězd, ve kterém jsou na 58 a 75 místech hvězdy, které jsou jasně viditelné v našich zeměpisných šířkách (Mizar je nejjasnější hvězda v souhvězdí Velké medvědice a Polární hvězda je Malá medvědice).
Zde je další originální příklad použití různých typů číslování. Následující HTML kód obsahuje tři seznamy s různým číslováním. Pro snadnější prohlížení je každý ze seznamů umístěn v samostatné buňce tabulky. Všechny tři seznamy jsou totožné a liší se pouze typem číslování: v prvním sloupci tabulky - arabské číslice, ve druhém - římské a ve třetím je číslování latinkou. Všimněte si, že položky seznamu jsou prázdné, tj. za jakoukoli značkou
- nejsou k dispozici žádné údaje. Příklad tohoto druhu lze použít jako srovnávací tabulku mezi zápisem čísel arabskými a římskými číslicemi. Ukázalo se, že jakýkoli prohlížeč, který podporuje seznamy, lze použít jako generátor pro takovou tabulku (obrázek 2.4), pokud zadáte poskytnutý HTML kód. Římské číslice fungují správně až do 3999. Prozkoumáním pravého sloupce pochopíte, jak se římské číslice číslují. Po vyčerpání jednopísmenného číslování (od A do Z) se první dvoupísmenné číslo bere jako další číslo - AA atd.
Používání <a href="https://obanracer.ru/cs/operatory-vetvleniya-v-komande-select-preobrazovaniya-nvl-dlya-razlichnyh-tipov.html">různých typů</a>číslování v seznamech -
. . .
-
. . .
-
. . .
Rýže. 2.4. Různé typy číslování seznamu HTML
Seznam definic
Seznamy definic, nazývané také slovníky definic speciálních termínů, jsou zvláštním druhem seznamů. Na rozdíl od jiných typů seznamů má každá položka v definičním seznamu vždy dvě části. V první části položky seznamu je napsán pojem, který se definuje, a ve druhé části text ve formě slovníkového hesla, odhalující význam pojmu.
Seznamy definic se zadávají pomocí značky kontejneru
- (Seznam definic). Uvnitř kontejneru se štítkem
- (Termín definice) označuje definovaný termín a značku
- (Definition Description) - odstavec s jeho definicí. Pro značky
- a
- nemusíte psát odpovídající koncové značky.
Obecně je seznam definic napsán takto:
- Období
- Definice pojmu
V textu za značkou
- prvky na úrovni bloku, jako jsou značky odstavce, nelze použít
Nebo hlavičky
-
... Text definovaného termínu by měl být obvykle na jednom řádku. Text obsahující definici termínu se zobrazí počínaje další řádek(nebo přes čáru u některých prohlížečů) za definici termínu, odsazeno vpravo. V informacích umístěných za značkou
- lze umístit prvky na úrovni bloku. To zejména znamená, že seznamy definic mohou být vnořené.
Ve štítku
- lze specifikovat parametr COMPACT, jehož účel je obdobný jako u ostatních výše popsaných seznamů.
- Flegmatik
- Pasivní, velmi zdatný, pomalu se přizpůsobující;
stabilní nálada, málo přístupná vnějším vlivům;
letargie emočních reakcí a pomalost ve volní činnosti
- Optimistický
- Aktivní, energický, snadno přizpůsobivý, -
živost a pohyblivost citových reakcí, rychlost a síla volních projevů
- Cholerik
- Aktivní, velmi energický, vytrvalý;
impulzivita a síla citových reakcí, násilné volní projevy
- Melancholický
- Pasivní, snadno se unaví, těžko se přizpůsobí, -
slabost chtění a převládající depresivní nálada, pochybnosti o sobě - Zempia
- měsíc
- Mapc
- Phobos
- Deimos
- Uran
- Ariel
- Umbriel
- Titania
- Oberon
- Miranda
- Neptune
- Triton
- Mořská nymfa
Dalším typem seznamů implementovaným v HTML je číslovaný seznam. Jinak se seznamy HTML tohoto typu nazývají uspořádané. Posledně jmenovaný název se často používá jako formální překlad názvu odpovídajícího tagu.
- , s jehož pomocí jsou seznamy tohoto typu organizovány v HTML dokumentech (OL - Ordered List).
- .
Zde je příklad dokumentu HTML pomocí číslovaného seznamu, jehož displej prohlížeč je znázorněn na obr. 2.3.
Příklad číslovaného seznamu Nejjasnější hvězdy viditelné ze Země:
- Sírius
- Do anopusu
- Arcturus
- Alfa Centauri
- Vega
- K apella
- Rigel
- Procyon
- Achernar
- Beta Centauri
- Vetelgeuse
- Aldebaran
- Mizar
- Polární
Rýže. 2.Z.Číslovaný seznam
Ve štítku
- lze zadat následující parametry: COMPACT, TYPE a START.
- .
Příklad nahrávání:
- .
Parametr START tag
- umožňuje začít číslovat seznam s jinou než jedna. Jako hodnota parametru START musí být vždy uvedeno přirozené číslo bez ohledu na typ číslování seznamů. Uveďme příklad:
- pro číslované seznamy umožňuje použití parametrů TYPE a VALUE. Parametr TYPE může nabývat stejných hodnot jako pro tag.
- .
- .
Poznámka
Prohlížeče interpretují zadání typu číslování pro jednotlivé položky seznamu odlišně. Prohlížeč Netscape změní číslování tohoto prvku a všech následujících, dokud nenarazí na další přepsání. Internet Explorer změní vzhled čísla pouze u této položky.
Hodnota parametru značky VALUE
- - umožňuje změnit číslo této položky seznamu. Tím se také změní číslování všech následujících prvků. Typickými aplikacemi jsou seznamy s vynecháním určitých prvků. Příklad takového seznamu byl uveden výše (obr. 2.3). Uvádí seřazený seznam nejjasnějších hvězd, ve kterém jsou na 58 a 75 místech hvězdy, které jsou jasně viditelné v našich zeměpisných šířkách (Mizar je nejjasnější hvězda v souhvězdí Velké medvědice a Polární hvězda je Malá medvědice).
Zde je další originální příklad použití různých typů číslování. Následující HTML kód obsahuje tři seznamy s různým číslováním. Pro snadnější prohlížení je každý ze seznamů umístěn v samostatné buňce tabulky. Všechny tři seznamy jsou totožné a liší se pouze typem číslování: v prvním sloupci tabulky - arabské číslice, ve druhém - římské a ve třetím je číslování latinkou. Všimněte si, že položky seznamu jsou prázdné, tj. za jakoukoli značkou
- nejsou k dispozici žádné údaje. Příklad tohoto druhu lze použít jako srovnávací tabulku mezi zápisem čísel arabskými a římskými číslicemi. Ukázalo se, že jakýkoli prohlížeč, který podporuje seznamy, lze použít jako generátor pro takovou tabulku (obrázek 2.4), pokud zadáte poskytnutý HTML kód. Římské číslice fungují správně až do 3999. Prozkoumáním pravého sloupce pochopíte, jak se římské číslice číslují. Po vyčerpání jednopísmenného číslování (od A do Z) se první dvoupísmenné číslo bere jako další číslo - AA atd.
Použití různých typů číslování v seznamech
. . .
Rýže. 2.4. Různé typy číslování seznamu HTML
HTML podporuje seznamy tří odlišné typy, z nichž každý má své vlastní téma:
Číslované seznamy
Do číslovaného seznamu prohlížeč automaticky vkládá čísla položek v pořadí, počínaje nějakou hodnotou (obvykle 1). To vám umožní vkládat a mazat položky v seznamu bez porušení číslování, protože zbytek čísel bude automaticky přepočítán.
Číslované seznamy se vytvářejí pomocí prvku bloku
Štítek- položka 1
- položka 2
- položka 3
Prvky číslovaného seznamu musí obsahovat více prvků seznamu, jak ukazuje následující příklad:
Příklad: Číslovaný seznam
- Zkus to sám "
- Získejte klíč
- Vložte klíč do zámku
- Otočte klíčem o dvě otáčky
- Vytáhněte klíč ze zámku
- Otevřít dveře
Návod krok za krokem
- Získejte klíč
- Vložte klíč do zámku
- Otočte klíčem o dvě otáčky
- Vytáhněte klíč ze zámku
- Otevřít dveře
Někdy při pohledu na existující HTML kódy narazíte na argument typ v prvku
- A - velká latinská písmena (A, B, C...);
- a - malá písmena latinky (a, b, c...);
- I - velké římské číslice (I, II, III...);
- i - malé římské číslice (i, ii, iii...);
- 1 - Arabské číslice (1, 2, 3...) (používá se ve výchozím nastavení).
- následujícím způsobem:
-
V tomto případě bude sekvenční číslování seznamu přerušeno a číslování začne znovu od tohoto bodu, v tomto případě od sedmi.
Příklad použití atributu hodnotaštítek
V tomto příkladu by „První položka seznamu“ měla číslo 1, „Druhá položka seznamu“ by bylo číslo 7 a „Třetí položka seznamu“ by bylo číslo 8.
Formátování číslovaných seznamů pomocí CSS
Chcete-li změnit čísla seznamu, použijte vlastnost list-style-type CSS styly:
- ... Prohlížeč odsadí každou položku seznamu a automaticky zobrazí odrážky.
- První bod
- Druhý bod
- Třetí bod
- není nutné umístit pouze text, je přípustné umístit jakýkoli prvek streamovaného obsahu (odkazy, odstavce, obrázky atd.)
- je možné vytvořit vnořený seznam nebo seznam druhé úrovně. Chcete-li vnořit seznam, popište nový seznam uvnitř prvku
- již dostupný seznam. Když vnoříte jeden seznam s odrážkami do jiného, prohlížeč automaticky změní styl odrážek pro seznam druhé úrovně. Jakýkoli seznam může být vnořen do jiného. Následující příklad ukazuje strukturu seznamu s odrážkami vnořeného do druhé číslované položky.
- Zkus to sám "
- pondělí
- Poslat mail
- Návštěva v redakci
- Výběr motivu
- Zdobený design
- Konečná zpráva
- Večerní prohlížení zpráv
- úterý
- Upravte rozvrh
- Posílejte obrázky
- Středa...
- pondělí
- Poslat mail
- Návštěva v redakci
- Výběr motivu
- Zdobený design
- Konečná zpráva
- Večerní prohlížení zpráv
- úterý
- Upravte rozvrh
- Posílejte obrázky
- Středa...
- Zkus to sám "
- Káva
- Káva
- Káva
- Káva
- Káva
- Mléko
- Káva
- Mléko
- Káva
- Mléko
- Káva
- Mléko
- Zkus to sám "
- Býk
- Blíženci
- Beran
- Býk
- Blíženci
- (z anglického Definition Term - definované slovo, termín) a
- (z anglického Definition Description - popis definovaného pojmu).
- První termín
- Popis prvního termínu
- Druhé období
- Popis druhého termínu
- Zkus to sám "
- Celosvětový web
- - z angličtiny. World Wide Web (WWW) je distribuovaný systém, který poskytuje přístup k propojeným dokumentům umístěným na různých počítačích připojených k internetu.
- Internet
- - soubor sítí, které k přenosu informací používají jeden protokol výměny.
- místo
- - soubor jednotlivých webových stránek, které jsou propojeny odkazy a jednotným designem.
- Jak je ukázáno níže.
- První bod
- Druhý bod
- Třetí bod
Pokud neuvedete žádné další atributy, stačí napsat značku
- , pak je výchozí seznam s arabskými čísly (1, 2, 3, ...), jak ukazuje příklad 11.3.
- vytvoření dochvilnosti (nikdy nepřijdete na nic pozdě);
- zotavení z dochvilnosti (nikdy nikam nespěchejte);
- změna vnímání času a hodin.
- arabská čísla (1, 2, 3, ...);
- velká písmena latinky (A, B, C, ...);
- malá písmena latinky (a, b, c, ...);
- velká římská čísla (I, II, III, ...);
- malá římská čísla (i, ii, iii, ...).
- Král Magnum XLIV
- Král Siegfried XVI
- Král Zikmund XXI
- Král Husbrandt I
- :
Číslovaný seznam:
- Káva
- Čaj
- Mléko
Poznámka: štítek
- tak jako podřízené prvky může obsahovat pouze značky
- , to znamená, že veškerý obsah číslovaného seznamu musí být umístěn uvnitř prvků
- ... Štítek
- , nemá zase žádná omezení obsahu, takže do něj můžete umístit odstavce, obrázky, odkazy, tabulky, další seznamy atd.
Seznam s odrážkami
Seznam s odrážkami- jedná se o neuspořádané, tedy neuspořádané seznamy prvků, na jejichž pořadí nezáleží. Všechny odrážky mají stejné odrážky, ve výchozím nastavení jsou zobrazeny jako malá černá kolečka.
Chcete-li vytvořit seznamy s odrážkami v HTML, použijte značku
- , uvnitř kterého jsou umístěny prvky samotného seznamu (stejně jako v případě číslovaných seznamů značka
- který obsahuje veškerý zobrazený obsah seznamu):
Seznam s odrážkami:
- Káva
- Čaj
- Mléko
Typy značek
Vzhled odrážky číslovaného seznamu lze změnit pomocí atributu type. Tento atribut podporuje pět typů značek:
Seznamy s odrážkami nemají atribut type, takže nemůžete použít HTML ke změně vzhledu odrážky u seznamu s odrážkami. Chcete-li změnit typ značky, v tomto případě můžete použít Vlastnost CSS m list-style-type, pomocí kterého můžete kromě výchozího vybrat další dva typy značek: kruh nebo čtverec.
Změna odrážek pro seznamy:
Název stránky Číslovaný seznam s atributem type = "a":
- jablka
- banány
- Citrony
Číslovaný seznam s atributem type = "I":
- jablka
- banány
- Citrony
Typy značek seznamu s odrážkami:
- jablka
- banány
- Citrony
- jablka
- banány
- Citrony
Vlastnost CSS typu list-style má kromě typů odrážek pro seznamy s odrážkami mnoho různých typů odrážek a pro číslované seznamy. Ale ne vždy změna jednoho standardního typu značky na jiný nestačí, aby seznam vypadal krásně. Pro návrh seznamů je lepší použít CSS, které umožňuje nejen měnit vzhled značky, ale také nahrazovat značky obrázky, ovládat jejich polohu a ovládat odsazení. Můžete se podívat, jak to všechno udělat.
Horizontální seznam
Pokud k vytvoření vodorovné nabídky používáte seznam HTML, budete muset položky seznamu uspořádat jednu za druhou na stejném řádku. Nebudete to moci udělat pomocí HTML, takže budete muset použít CSS.
Chcete-li vytvořit horizontální seznam, musíte napsat vlastnost zobrazení CSS pro položky seznamu s hodnotou inline nebo inline-block, podle toho, jaké další vlastnosti budete používat.
Název stránky Číslovaný seznam
- jablka
- banány
- Citrony
Seznam s odrážkami:
- jablka
- banány
- Citrony
Poté budou všechny položky v seznamu seřazeny do jednoho řádku. Upozorňujeme, že z položek seznamu zmizí odrážky a nebude mezi nimi ani mezera, ale odsazení vlevo v seznamu zůstane.
Můžete vidět, jak lze horizontální seznam proměnit na horizontální nabídku.
Doporučeno
Vzdělávací verze zdarma
Studio Vertex nabízí školení v programu KOMPAS-3D s využitím bezplatných i placených výukových materiálů. Pokud vlastníte toto...
- který obsahuje veškerý zobrazený obsah seznamu):
Příklad 11.3. Vytvořte číslovaný seznam
Číslovaný seznam Práce s časem
Výsledek tohoto příkladu je znázorněn na Obr. 11.3.
Rýže. 11.3. Zobrazení číslovaného seznamu
Všimněte si, že číslovaný seznam také přidává automatické odsazení horní, dolní a levé části textu.
Jako prvky číslování lze použít následující hodnoty:
Atribut type tagu se používá k označení typu číslovaného seznamu.
- ... Jeho možné hodnoty jsou uvedeny v tabulce. 11.2.
Tab. 11.2. Typy číslovaných seznamů
Typ seznamu HTML kód Příklad Arabská čísla
1. Cheburashka
2. Krokodýl Gena
3. ShapoklyakVelká písmena latinské abecedy
A. Cheburashka
B. Krokodýl Gena
C. ShapoklyakMalá písmena latinské abecedy
A. Cheburashka
b. Krokodýl Gena
C. ShapoklyakVelká římská čísla
I. Cheburashka
II. Krokodýl Gena
III. ShapoklyakMalá římská čísla
i. Cheburashka
ii. Krokodýl Gena
iii. ShapoklyakChcete-li seznam spustit na konkrétní hodnotě, použijte atribut start značky
- ... Nezáleží na tom, jaký typ seznamu je nastaven pomocí typu, atribut start funguje stejně s římskými a arabskými číslicemi. Příklad 11.4 ukazuje, jak vytvořit seznam s použitím velkých římských číslic začínajících osmi.
Příklad 11.4. Číslování seznamu
římská čísla Výsledek tohoto příkladu je znázorněn na Obr. 11.4.
Rýže. 11.4. Číslovaný seznam s římskými čísly
V HTML je za organizaci seznamů odpovědná celá sada značek, jejichž organizace musí dodržovat určitá pravidla pro strukturování dat.
Pátý standard html verze Podporovány jsou 3 druhy seznamů: číslované seznamy, seznamy s odrážkami a seznamy definic. Poskytuje také možnost vnořovat seznamy do sebe a vytvářet vnořené víceúrovňové seznamy.
Číslovaný seznam
Číslovaný seznam je sada prvků (položky seznamu), které mají určitou sekvenci. Každá položka v číslovaném seznamu má jedinečnou značku označující pořadí, ve kterém by měla být tato položka umístěna vzhledem k ostatním položkám v seznamu. Ve výchozím nastavení jsou odrážky pro položky číslovaného seznamu čísla. První položka je pod číslem 1, druhá pod číslem 2 a tak dále.
Nejběžnějšími příklady číslovaných seznamů jsou recepty na různá jídla. Protože každý recept je očíslovaný seznam s jasným sledem akcí.
Chcete-li vytvořit číslované seznamy v HTML, použijte značku
- , uvnitř kterého jsou umístěny prvky seznamu s daty. Každá položka v seznamu je označena štítkem
Styly pro číslované seznamy
Příklad Význam Popis a, b, c nižší-alfa Malá písmena A, B, C horní alfa Velká písmena i, ii, iii nižší římský Římské číslice malými písmeny I, II, III horní římský Velká římská čísla Příklad: Použití vlastnosti CSS list-style-type
Seznamy s odrážkami
Seznamy s odrážkami ve skutečnosti jsou podobné číslovaným, jen neobsahují postupné číslování odstavců. Seznamy s odrážkami se vytvářejí pomocí prvku bloku
ŠtítekV následujícím příkladu můžete vidět, že ve výchozím nastavení je před každou položku seznamu přidána malá značka vyplněného kruhu:
Uvnitř štítku
Vnořené seznamy
Jakýkoli seznam může být vnořen do jiného. Vnitřní prvekPříklad: Vnořené seznamy
Formátování seznamů s odrážkami
Pro změnu vzhled značka seznamu by měla používat vlastnost list-style-type CSS styly:
Následující příklad ukazuje různé styly seznamů s odrážkami:
Příklad: Styly seznamu s odrážkami
Disk:
Kruh:
Náměstí:
Žádný:
Grafické značky.
HTML má schopnost vytvářet seznam s grafickými značkami. Něco jiného je, když jsou odrážky seznamu standardní kruhy nebo čtverce, a něco úplně jiného, když si vývojář sám vybere značku v souladu s designem stránky. K tomu, aby položky seznamu vypadaly pěkně, se často používají malé obrázky.
Chcete-li nahradit běžnou značku grafickou, nahraďte vlastnost list-style-type za nemovitost list-style-image a zadejte URL adresu obrázku:Příklad: Grafické značky
znamení zvěrokruhu
znamení zvěrokruhu
Definiční (popisové) seznamy
Seznamy definic jsou velmi užitečné pro vytvoření například vašeho osobního slovníku pojmů. Každá položka v seznamu definic má dvě části: termín a jeho definici.
Celý seznam vložíte do prvku
Seznamy definic se často používají ve vědeckých, technických a vzdělávacích publikacích, s jejich pomocí tvoří glosáře, slovníky, příručky atd.Obecná struktura seznamu popisů je následující:
Následující příklad ukazuje jeden z možná použití seznam definic:
Příklad: Seznam definic
World Wide Web – z angl. World Wide Web (WWW) je distribuovaný systém, který poskytuje přístup k propojeným dokumentům umístěným na různých počítačích připojených k internetu. Internet je soubor sítí, které k přenosu informací používají jeden protokol výměny. Web je sada jednotlivých webových stránek, které jsou propojeny odkazy a jediným designem.
Ve výchozím nastavení je text termínu přitlačen k levému okraji okna prohlížeče a popis termínu je umístěn níže a posunut doprava.
Číslované seznamy jsou sbírkou položek s jejich pořadovými čísly. Typ a typ číslování závisí na atributech tagu
- , který se používá k vytvoření seznamu. Každá položka v číslovaném seznamu je označena štítkem
Zde: zadejte znaky ze seznamu:
Pokud chcete, aby seznam začínal číslem jiným než 1, musíte to zadat pomocí atributu Startštítek
Následující příklad ukazuje číslovaný seznam s velkými římskými číslicemi a počáteční hodnota XLIX:Číslování můžete začít pomocí atributu hodnota který se přidá k prvku
Příklad záznamu:
- .
- .
Takový záznam určuje číslování seznamu od velkého latinského písmene „E“. U ostatních typů číslování se zadáním START = 5 nastaví číslování, respektive od čísla "5", římské číslice "V" atd.
Změnu typu číslování seznamu a hodnot čísel lze provést pro jakýkoli prvek seznamu. Štítek
- pro číslované seznamy umožňuje použití parametrů TYPE a VALUE. Parametr TYPE může nabývat stejných hodnot jako pro tag.
Parametr COMPACT má stejný význam jako seznamy s odrážkami. Parametr TYPE slouží k nastavení typu číslování seznamů. Může nabývat následujících hodnot:
TYP = A - nastavuje značky ve formě velkých latinských písmen;
TYP = a - určuje značky ve formě malých latinských písmen;
TYP = I - určuje značky ve formě velkých římských číslic;
TYP = i - určuje značky ve formě malých římských číslic;
TYP = 1 - určuje značky ve formě arabských číslic.
Standardně se vždy používá hodnota TYP = 1, tedy číslování pomocí arabských číslic. To platí také pro vnořené číslované seznamy. Zde, na rozdíl od seznamů s odrážkami, prohlížeče ve výchozím nastavení nedělají různé číslování na různých úrovních vnoření seznamů. Všimněte si, že za číslem prvku seznamu je vždy dodatečně zobrazen znak "tečka".
Parametr TYPE se stejnými hodnotami lze použít k určení stylu číslování jednotlivých položek seznamu. K tomu je povoleno zadat parametr TYPE s odpovídající hodnotou v tagu položky seznamu
Seznamy tohoto typu jsou obvykle uspořádanou posloupností jednotlivých položek. Rozdíl od seznamů s odrážkami spočívá v tom, že v číslovaném seznamu je každému prvku automaticky předřazeno pořadové číslo. Typ číslování závisí na prohlížeči a lze jej nastavit parametry značek seznamu. Jinak je implementace číslovaných seznamů velmi podobná implementaci seznamů s odrážkami.
Tagy
- a
Chcete-li vytvořit číslovaný seznam, použijte značku kontejneru, která obsahuje všechny položky seznamu. Počáteční a koncové značky seznamu poskytují řádkové posuvy před a za seznamem, čímž oddělují seznam od hlavního obsahu dokumentu.
Stejně jako u seznamu s odrážkami musí každá položka v číslovaném seznamu začínat značkou
Zde je příklad dokumentu HTML, který používá seznam definic:
Příklad seznamu definic Klasifikace typických lidských temperamentů,
Založenýna názory Hippokrata
Zobrazení daného HTML dokumentu v prohlížeči je na Obr. 2.5.
Rýže. 2.5. Seznam definic (připomíná skupinu hesel ve slovníku)
Seznamy typů
a - .
Zpočátku byly tyto typy seznamů koncipovány jako kompaktnější než běžné seznamy s odrážkami. Podle pravidel pro zápis prvků těchto seznamů v nich nebylo povoleno používat blokové prvky, což znamená, že nelze realizovat vnořování seznamů tohoto typu. Každá položka v seznamu byl jeden řádek textu.
Pro seznamy jako
bylo plánováno zavedení omezení na „délku textu položky seznamu (24 znaků). Takové omezení by umožnilo odvodit seznamy jako
ve formě podobné výpisu adresářů v operační systémy UNIX a MS-DOS při použití přepínače /W (více sloupců). U položek seznamu tohoto typu se navíc nezobrazovaly značky. V současné době nebyly všechny tyto myšlenky realizovány, protože další používání seznamů těchto typů se nedoporučuje. Moderní verze prohlížečů zobrazují seznamy těchto typů přesně stejným způsobem jako seznamy daného typu
- .
Vnořené seznamy
Jsou chvíle, kdy položka seznamu jednoho typu musí obsahovat celý seznam stejného nebo jiného typu. Tím se uspořádají víceúrovňové nebo vnořené seznamy. HTML umožňuje libovolné vnořování různých typů seznamů, ale při jejich organizování je třeba postupovat opatrně.
Níže je uveden HTML kód dokumentu s vnořenými seznamy, jehož zobrazení je na Obr. 2.6. V tomto příkladu má každá položka v seznamu s odrážkami svůj vlastní očíslovaný seznam.
Příklad vnořeného seznamu Satelity některých planet
- lze umístit prvky na úrovni bloku. To zejména znamená, že seznamy definic mohou být vnořené.
-
NS Příklad záznamu:
- .
- .
Takový záznam určuje číslování seznamu od velkého latinského písmene „E“. U ostatních typů číslování se zadáním START = 5 nastaví číslování, respektive od čísla "5", římské číslice "V" atd.
Změnu typu číslování seznamu a hodnot čísel lze provést pro jakýkoli prvek seznamu. Štítek
- pro číslované seznamy umožňuje použití parametrů TYPE a VALUE. Parametr TYPE může nabývat stejných hodnot jako pro tag.
Parametr COMPACT má stejný význam jako seznamy s odrážkami. Parametr TYPE slouží k nastavení typu číslování seznamů. Může nabývat následujících hodnot:
TYP = A - nastavuje značky ve formě velkých latinských písmen;
TYP = a - určuje značky ve formě malých latinských písmen;
TYP = I - určuje značky ve formě velkých římských číslic;
TYP = i - určuje značky ve formě malých římských číslic;
TYP = 1 - určuje značky ve formě arabských číslic.
Standardně se vždy používá hodnota TYP = 1, tedy číslování pomocí arabských číslic. To platí také pro vnořené číslované seznamy. Zde, na rozdíl od seznamů s odrážkami, prohlížeče ve výchozím nastavení nedělají různé číslování na různých úrovních vnoření seznamů. Všimněte si, že za číslem prvku seznamu je vždy dodatečně zobrazen znak "tečka".
Parametr TYPE se stejnými hodnotami lze použít k určení stylu číslování jednotlivých položek seznamu. K tomu je povoleno zadat parametr TYPE s odpovídající hodnotou v tagu položky seznamu
Seznamy tohoto typu obvykle představují uspořádanou sekvenci jednotlivých prvků. Rozdíl od seznamů s odrážkami spočívá v tom, že v číslovaném seznamu je každému prvku automaticky předřazeno pořadové číslo. Typ číslování závisí na prohlížeči a lze jej nastavit parametry značek seznamu. Jinak je implementace číslovaných seznamů velmi podobná implementaci seznamů s odrážkami.
Tagy
- a
Pro vytvoření číslovaného seznamu použijte tag-container, ve kterém jsou umístěny všechny prvky seznamu. Počáteční a koncové značky seznamu poskytují řádkové posuvy před a za seznamem, čímž oddělují seznam od hlavního obsahu dokumentu.
Stejně jako u seznamu s odrážkami musí každá položka v číslovaném seznamu začínat značkou
- které ukazují na jednotlivé položky seznamu, poskytují standardní značky položek seznamu.
Parametr COMPACT je zapsán bez hodnot a používá se k tomu, aby prohlížeč zobrazil tento seznam v kompaktním formátu. Lze například zmenšit písmo nebo vzdálenost mezi řádky seznamu atd.
Poznámka
Aktuálně přítomnost parametru COMPACT ve značce
- nijak neovlivňuje zobrazení seznamů předními prohlížeči. Proto je použití tohoto parametru nesmyslné, zejména proto, že jeho použití není doporučeno specifikací HTML 4.0.
Parametr TYPE může nabývat následujících hodnot: disk, kruh a čtverec. Tento parametr se používá k vynucení zobrazení značek seznamu. Přesný typ značky bude záviset na použitém prohlížeči. Typické možnosti zobrazení jsou následující:
TYP = disk - značky jsou zobrazeny s vyplněnými kroužky; TYP = kruh - značky jsou zobrazeny s otevřenými kruhy; TYP = čtverec - značky jsou zobrazeny s vyplněnými čtverečky. Příklad nahrávání:
-
.
Výchozí hodnota je TYP = disk. Pro vnořené seznamy s odrážkami je výchozím nastavením disk na první úrovni, kruh na druhé a čtverec na třetí a dále. To je přesně to, co se dělá v nejnovější verze Prohlížeče Netscape a internet Explorer... Upozorňujeme, že jiné prohlížeče mohou značky zobrazovat jinak. Specifikace HTML 4.0 například specifikuje čtvercový obrys pro vzhled značky, který se zobrazí, když TYPE = square.
Parametr TYPE se stejnými hodnotami lze použít k určení typu značek pro jednotlivé položky seznamu. K tomu je povoleno zadat parametr TYPE s odpovídající hodnotou v tagu položky seznamu
- .
- ,
- ,
- , s jehož pomocí jsou seznamy tohoto typu organizovány v HTML dokumentech (UL - Unordered List, neuspořádaný seznam).
Seznam s odrážkami používá ke zvýraznění svých položek speciální znaky nazývané odrážky seznamu (často nazývané odrážky, což je formální výslovnost anglického výrazu bullet). Typ značek seznamu určuje prohlížeč a při vytváření vnořených seznamů prohlížeče automaticky diverzifikují vzhled značek na různých úrovních vnoření.
Tagy a<LI>
Chcete-li vytvořit seznam s odrážkami, musíte použít kontejner tagů, uvnitř kterého jsou umístěny všechny prvky seznamu. Značky úvodního a závěrečného seznamu poskytují posun řádků před a za seznam, čímž oddělují seznam od hlavního obsahu dokumentu, takže zde není potřeba používat značky odstavců.
.
Každý prvek seznamu musí začínat značkou
