Seznam HTML. Použití stylů CSS
Na mnoha stránkách HTML v textu můžete zobrazit seznamy. S jejich pomocí vytvářejte nabídky, pokyny, krok za krokem algoritmy, systematizujte informace a provádějte mnohem víc. Seznam HTML je vytvořen pomocí textového značkovacího jazyka. Chcete-li to provést, použijte několik značek. Jedná se o jednu z nejběžnějších forem prezentace informací v komprimované podobě a současně jasně.
Seznamy se používají hlavně v následujících případech:
- prezentace informací v jediné struktuře s pohodlným vnímáním;
- zjednodušení složitých sekvenčních procesů;
- tvorba struktur s obsahem, body a vysvětleními.
Seznamy existují ve třech odrůdách:
- číslované;
- označeno;
- seznamy definic.
Číslovaný seznam
Číslování je vhodné, když seznam položek v pořadí. Seznam HTML se otevírá a zavírá pomocí značek <ol> a </ ol>.
Kódový seznam bude:
<ol>
<li> 1 položka </ li>
<li> 2 </ item> prvek
<li> 3 prvky </ li >>
</ ol>
Každá pozice je umístěna uvnitř tagu <li>.
Seznam s odrážkami
Polohy nejsou očíslovány a uspořádány v libovolném pořadí. Seznam kódů je podobný předchozímu. Jediný rozdíl je v tom, že se nachází uvnitř <ul> tagu:
<ul>
<li> první </ li>
<li> druhý </ li>
<li> třetí </ li>
- </ ul>
Výchozí značka je označena černým kruhem, ale obrázek se upravuje pomocí atributu type, například:
<ul typ = "čtverec">
Podobně změňte označení číslovaného seznamu, například přiřazením atributu doslovné hodnoty:
<ol type = "A">
Seznam definic
Často je třeba vybrat slova z hlavního textu a poskytnout jim vysvětlení. Chcete-li to provést, vytvořte seznam prvků s jejich definicemi. Kód se otevře a zavře pomocí značek <dl> a </ dl>. Vně jsou uspořádány v pořadí elementy uzavřené ve dvojici <dt> a </ dt>. Často se navíc označují značkami <strong> ... </ strong>. Po každé položce jsou vysvětlení zarovnány spárovanými <dd> ... </ dd>. Obecně platí, že kód vypadá takto:
<h2> DefiniceList </ h2>
<dl>
<dt> www </ dt>
<dd> www představuje celosvětový web </ dd>
<dt> CSS </ dt>
<dd> CSS představuje stylové listy </ dd>
</ dl>
Na stránce výsledek provádění tohoto kódu bude vypadat takto: 
Rozbalovací seznam
Někdy je vhodné rozbalit seznamy. V počátečním stavu jsou zavřené a ve výchozím nastavení je viditelná pouze první pozice. Kódová schéma je podobná předchozí. Položky seznamu jsou vytvořeny s volitelnou značkou vloženou do kontejneru <select>:
<select>
<option> el1
<option> el2
<zvolená možnost> el3
Ve výchozím nastavení se vždy zobrazí první položka. Může být nahrazen použitím vybraného atributu značky <option>, jak je znázorněno v kódu v rozevíracím seznamu. Třetí položka se zobrazí, když je seznam uzavřen.
V některých seznamech je nutné vybrat několik pozic najednou. Pro tento účel se používá vícenásobný atribut značky <select>.
Jak vytvořit seznam v rozbalovací nabídce HTML a CSS
Ačkoli značka je široce používána, je poměrně omezená. Rozbalovací seznam HTML je vylepšen pomocí CSS. Jeho typ může být jakýkoli.
<div class = "rolls">
<button> produkty
<ul>
<a> <li> 1 prvek </ li> </ a>
<a> <li> 2 prvky </ li> </ a>
<a> <li> 3 prvky </ li> </ a>
</ ul>
Nyní musíte použít kód CSS. Často se používají pro velkolepý design, ale je lepší se nejprve zaměřit na zajištění efektivnosti rozbalovacího seznamu. Mělo by se na obrazovce objevit, když umístíte ukazatel myši na nadpis.
Styly určují podmínky pro zobrazení nebo skrytí seznamu:
.rolls a {
seznam: žádný;
displej: žádné}
.rolls: podržte kurzor {
zobrazení: blok}
Když se tedy myší pohybuje nad tlačítkem, na stránce se zobrazí seznam zobrazený na následujícím obrázku. 
Víceúrovňové rozevírací seznamy
Pokud jednoduché seznamy rozložení stránky nemusí stačit, ale množství informací by měl být skvělý. Toto je místo, kde se na záchranu dostanou víceúrovňové rozevírací seznamy. Jejich struktura je někdy složitá. Chcete-li odstranit chyby, měli byste pečlivě sledovat počáteční a koncové značky. Předchozí seznam definic je také víceúrovňový. Je vhodné použít k vytváření slovníků nebo vysvětlení pojmů.
Rozbalovací seznam HTML se používá, aby se stránka nevyrovnávala a rozšiřovala její funkce. Jako základní nástroj stačí použít značkovací jazyk. Současně platí, že pro libovolnou úroveň vnoření kód zůstává stejný.
Funkční seznam HTML bude fungovat, ale pomocí stylových listů ho můžete navrhnout tak, aby byl krásný a pohodlný. 
Závěr
Existují seznamy různých typů HTML. Jsou vytvořeny podle stejného schématu, včetně vnořených. Funkce seznamů jsou vylepšeny styly CSS. Pomocí stylů můžete vytvořit jedinečné nástroje. Současně je důležité, aby byly seznamy správně sémanticky navrženy, aby se usnadnila údržba míst pro sebe.