HTML tagované. Zoznamy v HTML - zoznam s odrážkami - číslovaný zoznam - zoznam definícií - vnorené zoznamy v HTML. Príklad: Grafické značky

Jedným z typov zoznamov implementovaných v HTML je zoznam s odrážkami. V opačnom prípade sa zoznamy tohto typu nazývajú nečíslované alebo nezoradené. Priezvisko sa často používa ako formálny preklad názvu zodpovedajúcej značky

    , pomocou ktorej sú zoznamy tohto typu organizované v HTML dokumentoch (UL - Unordered List, unordered list).

    V zozname s odrážkami sa na zvýraznenie jeho prvkov používajú špeciálne znaky nazývané značky zoznamu (často sa nazývajú odrážky, čo je formálna výslovnosť anglického výrazu bullet). Vzhľad značiek zoznamov určuje prehliadač a pri vytváraní vnorených zoznamov prehliadače automaticky diverzifikujú vzhľad značiek na rôznych úrovniach vnorenia.

    Tagy
      A

    Ak chcete vytvoriť zoznam s odrážkami, musíte použiť kontajnerovú značku, v ktorej sa nachádzajú všetky prvky zoznamu. Značky úvodného a záverečného zoznamu poskytujú zalomenie riadku pred a za zoznamom, čím oddeľujú zoznam od hlavného obsahu dokumentu, takže tu nie je potrebné používať značky odsekov


    .

    Každý prvok zoznamu musí začínať značkou

  • (LI - Položka zoznamu, prvok zoznamu). Tag
  • nevyžaduje zodpovedajúci uzatvárací štítok, hoci jeho prítomnosť v zásade nie je zakázaná. Prehliadače sa zvyčajne spúšťajú pri každom zobrazení dokumentu. nový prvok zoznam z nového riadku.

    Poskytnuté informácie sú dostatočné na vytvorenie základného zoznamu s odrážkami. Uveďme príklad HTML dokumentu pomocou odrážkového zoznamu, ktorého zobrazenie prehliadačom je na obr. 2.1.

    Príklad zoznamu s odrážkami

    Znamenia zverokruhu:

    • Baran

    • Býk

    • Dvojičky

    • Panna

    • Váhy

    • Scorpion

    • Strelec

    • Kozorožec

    • Vodnár

    • Ryby

    Ryža. 2.1. Zobrazenie zoznamu s odrážkami v prehliadači

    Všimnite si, že okrem prvkov zoznamu označených značkou

  • , môžu byť prítomné ďalšie prvky HTML. Vo vyššie uvedenom príklade je jedným z týchto prvkov obyčajný text, ktorý nie je položkou zoznamu, ale slúži ako jeho názov.

    Poznámka

    Niektoré učebnice jazyka HTML uvádzajú, že na nastavenie názvu zoznamu by sa mala použiť kontajnerová značka (LH - Hlavička zoznamu, hlavička zoznamu). Túto značku momentálne nerozpoznávajú žiadne bežné prehliadače a nie je súčasťou špecifikácie HTML. Jeho použitie sa tak stáva zbytočným, hoci nepovedie k žiadnym chybám.

    V značke

      možno zadať dva parametre: COMPACT a TYPE.

      Parameter COMPACT sa zapisuje bez hodnoty a používa sa na to, aby to prehliadaču oznámil tento zoznam by mali byť prezentované v kompaktnej forme. Môže sa napríklad zmenšiť písmo alebo vzdialenosť medzi riadkami zoznamu atď.

      Poznámka

      V súčasnosti je v tagu prítomný parameter COMPACT

        žiadnym spôsobom neovplyvňuje zobrazenie zoznamov v popredných prehliadačoch. Preto aplikácia tento parameter nemá význam, najmä preto, že jeho použitie neodporúča špecifikácia HTML 4.0.

        Parameter TYPE môže nadobúdať nasledujúce hodnoty: disk, kruh a štvorec. Tento parameter sa používa na vynútenie zobrazenia odrážok zoznamu. Presný typ značky bude závisieť od prehliadača, ktorý používate. Typické možnosti zobrazenia sú nasledovné:

        TYP = disk - značky sú zobrazené ako vyplnené kruhy; TYP = kruh - značky sa zobrazujú ako otvorené kruhy; TYP = štvorec - značky sa zobrazujú ako vyplnené štvorce. Príklad vstupu:

          .

          Predvolená hodnota je TYP = disk. Pre vnorené zoznamy s odrážkami je predvolená hodnota disk na prvej úrovni, kruh na druhej úrovni, štvorec na tretej úrovni a ďalej. Presne toto sa robí v najnovšie verzie Prehliadače Netscape a internet Explorer. Upozorňujeme, že iné prehliadače môžu značky zobrazovať inak. Napríklad v HTML špecifikácie 4.0 pre typ značky, ktorý sa zobrazuje pri hodnote TYP = štvorec, je označený nevyplnený štvorec (štvorcový obrys).

          Parameter TYPE s rovnakými hodnotami možno použiť na určenie typu značiek pre jednotlivé prvky zoznamu. Na tento účel je povolené zadať parameter TYPE s príslušnou hodnotou v značke prvku zoznamu

        • .

          Príklad vstupu:

        • .

          Poznámka

          Prehliadače interpretujú špecifikáciu typu odrážky pre jednotlivé položky zoznamu odlišne. Prehliadač Netscape zmení vzhľad značky pre túto a všetky nasledujúce, až kým nenarazíte na ďalšiu redefiníciu vzhľadu značky. Internetový prehliadač Prieskumník zmení vzhľad značky iba pre tento prvok.

          Grafické značky zoznamu

          Grafické obrázky môžete použiť ako odrážky zoznamu, čo sa široko používa na vytváranie atraktívnych a dobre navrhnutých dokumentov HTML. V skutočnosti sa takáto príležitosť neposkytuje priamo jazyk HTML, ale je implementovaný trochu umelo. To neznamená, že to nie je odporúčané alebo odsúdeniahodné, ale iba to, že tu nebudú použité žiadne špeciálne konštrukcie jazyka HTML.

          Aby ste pochopili túto myšlienku, musíte pochopiť mechanizmus implementácie zoznamov na stránkach HTML. Ukazuje sa, že značka zoznamu

            (ako v skutočnosti zoznam značiek iných typov, o ktorých sa hovorí nižšie) vykonáva jedinú úlohu – informuje prehliadač, že všetky informácie umiestnené za touto značkou by sa mali zobraziť posunuté doprava (odsadené) o určitú hodnotu. Tagy
          • , ktoré ukazujú na jednotlivé položky zoznamu, poskytujú štandardné značky položiek zoznamu.

            Ak potrebujeme zostaviť zoznam s grafickými značkami, vystačíme si úplne bez značiek

          • . Bude stačiť vložiť požadovaný grafický obrázok pred každý prvok zoznamu. Jediný problém, ktorý treba vyriešiť, je oddelenie prvkov zoznamu od seba. Na to môžete použiť značky odsekov

            Alebo vynútiť posun riadku
            . Príklad implementácie zoznamu s grafickými značkami, ktorých zobrazenie je na obr. 2.2 je uvedený nižšie:

            ktorý sa bude vysielať iba raz. Veľkosti súboru malého obrázka sú tiež extrémne malé.

            Poznámka

            Metódy vytvárania zoznamov s grafickými odrážkami sú postupne diskutované v kapitole 8.


            Hlavné použitie zoznamov:

            Číslované - na zoznam prvkov, ktoré nasledujú v presne definovanom poradí.

            S odrážkami – zoznam prvkov v náhodnom poradí.

            Viacúrovňové - špecifikovať informácie o určitých prvkoch.

            Zoznam definícií – používa sa na formátovanie slovníkov.

            HTML stránka s číslovaným zoznamom

            Tagy sa používajú na vytváranie číslovaných zoznamov

            1. Tag

                Tag

              1. Položky zoznamu sú štandardne číslované v poradí 1, 2, 3... Pomocou atribútu TYP môžete zmeniť štýl číslovania.

                Číslovanie hodnôt TYP A A, B, C.. a a, b, c.. I I, II, III.. i i, ii, iii.. 1 1. 2. 3..

                Ak už pridáte existujúci zoznam nové hodnoty, prehliadač ho automaticky prepočíta.

                Pomocou atribútov ZAČIATOČNÁ HODNOTA môžete zmeniť poradie číslovania zoznamu.

                ŠTART - slúži na určenie štartovného čísla zoznamu, odlišného od 1.

                HODNOTA - umožňuje priradiť ľubovoľné číslo ľubovoľnému prvku zoznamu.

                Príklad:

                HTML stránka s odrážkami

                Značky sa používajú na vytváranie zoznamov s odrážkami

                  Tag

                    Označí sa začiatok/koniec celého zoznamu.

                    Tag

                  • označujú začiatok/koniec jednotlivého prvku zoznamu.

                    Položky zoznamu sú štandardne označené čiernym krúžkom. Atribút TYPE možno použiť na zmenu štýlu označovania.

                    V rámci jedného zoznamu môžete použiť rôzne označenia prvkov zoznamu.

                    Príklad:

                    Viacúrovňová html stránka zoznamu

                    Ak chcete vytvoriť viacúrovňové zoznamy, môžete použiť zoznamy s odrážkami alebo číslované zoznamy, prípadne kombináciu oboch. Viacúrovňový zoznam sa vytvorí vnorením jedného zoznamu do tela druhého. Hlavnou úlohou nie je zmiasť sa. Aby ste to dosiahli, odporúčam vám urobiť rôzne zarážky pre jednotlivé zoznamy.

                    Zoznamy definícií html stránok

                    Na vytvorenie zoznamov definícií sa používajú tri značky:

                    - začiatok/koniec zoznamu.

                    - začiatok/koniec konkrétneho obdobia.

                    - začiatok/koniec vysvetľujúceho článku daného pojmu.

                    Tagy

                    A
                    nie je potrebné striedať. Tie. Môžete „prepojiť“ niekoľko výrazov s jednou definíciou a naopak.

                    Príklad:

                    HTML kód:


                    Termín 1

                    Abstrakt1 až termín 1

                    Abstrakt2 až termín 1

                    Displej prehliadača:


                    Termín 1 Abstrakt1 až termín 1 Abstrakt2 až termín 1

                    Keďže na tejto stránke sú na niektoré prvky aplikované určité štýly, ich zobrazenie v tabuľke sa trochu líši od toho, čo získate.

                    HTML zoznamy používa sa na zoskupovanie súvisiacich informácií. Existujú tri typy zoznamov:

                    odrážkový zoznam

                      - každý prvok zoznamu
                    • označené fixkou,
                      číslovaný zoznam
                        - každý prvok zoznamu
                      1. označené číslom
                        zoznam definícií- - pozostáva z pojmových dvojíc
                        definícia.

                        Každý zoznam je kontajner, v ktorom sa nachádzajú prvky zoznamu alebo páry výraz-definícia. Prvky zoznamu sa správajú ako prvky bloku, sú naukladané pod sebou a zaberajú celú šírku kontajnerového bloku. Každá položka zoznamu má na boku ďalší blok, ktorý sa nezúčastňuje na rozložení.

                        Vytváranie zoznamov HTML

                        1. Zoznam s odrážkami

                        Zoznam s odrážkami je neusporiadaný zoznam (z anglického neusporiadaného zoznamu). Vytvorené pomocou spárovanej značky

                        . Značka prvku zoznamu je štítok, napríklad vyplnený kruh.

                        Prehliadače štandardne pridávajú do bloku zoznamu nasledujúce formátovanie:

                        Každý prvok zoznamu je vytvorený pomocou párovej značky

                      2. (z anglickej položky zoznamu).
                        k dispozícii .
                      • Microsoft
                      • Google
                      • Apple
                      Ryža. 1. Zoznam s odrážkami

                      2. Číslovaný zoznam

                      Číslovaný zoznam sa vytvára pomocou spárovanej značky. Každá položka zoznamu je tiež vytvorená pomocou prvku

                    • . Prehliadač čísluje prvky v poradí automaticky a ak vymažete jeden alebo viac prvkov takéhoto zoznamu, zostávajúce čísla sa automaticky prepočítajú.

                      Blok zoznamu má tiež predvolené štýly prehliadača:

                    • K dispozícii je atribút value, ktorý umožňuje zmeniť predvolené číslo pre vybratú položku zoznamu. Napríklad, ak pre prvú položku v zozname, ktorú nastavíte
                    • , potom bude zostávajúce číslovanie prepočítané vzhľadom na novú hodnotu.

                      Pre značku

                        K dispozícii sú nasledujúce atribúty:

                        Tabuľka 1. Atribúty značiek
                        Atribút Popis, akceptovaná hodnota
                        obrátené Obrátený atribút spôsobí, že sa zoznam zobrazí v opačnom poradí (napríklad 9, 8, 7...).
                        začať Atribút štart určuje počiatočnú hodnotu, od ktorej sa začne číslovanie, napríklad stavba
                          prvej položke bude pridelené poradové číslo „10“. Súčasne môžete zadať aj typ číslovania, napr.
                            .
                        typu Atribút type určuje typ značky, ktorá sa má použiť v zozname (písmená alebo čísla). Akceptované hodnoty:
                        1 — predvolená hodnota, desiatkové číslovanie.
                        A — číslovanie zoznamu v abecednom poradí veľkými písmenami (A, B, C, D).
                        a — číslovanie zoznamu v abecednom poradí, malé písmená (a, b, c, d).
                        I - číslovanie rímskymi veľkými číslicami (I, II, III, IV).
                        i — číslovanie rímskymi malými číslicami (i, ii, iii, iv).
                        1. Microsoft
                        2. Google
                        3. Apple
                        Ryža. 2. Číslovaný zoznam

                        3. Zoznam definícií

                        Zoznamy definícií sú vytvorené pomocou značky

                        . Ak chcete pridať výraz, použite značku
                        a na vloženie definície - značky
                        .

                        Blok zoznamu definícií má nasledujúce predvolené štýly prehliadača:

                        Pre značky

                        ,
                        A
                        k dispozícii .

                        riaditeľ:
                        Peter Tochilin
                        Obsadenie:
                        Andrej Gaidulyan
                        Alexej Gavrilov
                        Vitalij Gogunskij
                        Marija Kozhevnikovová
                        Ryža. 3. Zoznam definícií

                        4. Vnorený zoznam

                        Možnosti jednoduchých zoznamov často nestačia, napríklad pri vytváraní obsahu neexistuje spôsob, ako sa bez vnorené položky. Označenie vnoreného zoznamu by bolo nasledovné:

                        • odsek 1.
                        • Bod 2.
                          • Článok 2.1.
                          • Článok 2.2.
                            • Odsek 2.2.1.
                            • Článok 2.2.2.
                          • Článok 2.3.
                        • Bod 3.

                        Ryža. 4. Vnorený zoznam

                        5. Viacúrovňový číslovaný zoznam

                        Viacúrovňový zoznam sa používa na zobrazenie položiek zoznamu na rôznych úrovniach s rôznym odsadením. Označenie pre viacúrovňový číslovaný zoznam by bolo nasledovné:

                        1. odsek
                        2. odsek
                          1. odsek
                          2. odsek
                          3. odsek
                            1. odsek
                            2. odsek
                            3. odsek
                          4. odsek
                        3. odsek
                        4. odsek

                        Toto predvolené označenie vytvorí nové číslovanie pre každý vnorený zoznam, počnúc jednotkou. Ak chcete vytvoriť vnorené číslovanie, musíte použiť nasledujúce vlastnosti:
                        vynulovanie počítadla vynuluje jedno alebo viac počítadiel, pričom určí hodnotu, ktorá sa má vynulovať;
                        prírastok počítadla určuje hodnotu prírastku počítadla, t.j. v akých prírastkoch bude každá nasledujúca položka očíslovaná;
                        obsah - generovaný obsah, v tomto prípade zodpovedá za zobrazenie čísla pred každou položkou zoznamu.

                        Ol ( /* odstráňte štandardné číslovanie */ štýl zoznamu: žiadny; /* Identifikujte počítadlo a pomenujte ho li. Hodnota počítadla nie je špecifikovaná - štandardne je 0 */ counter-reset: li; ) li :before ( /* Definujeme prvok, ktorý sa bude číslovať - ​​li. Pseudoprvok before označuje, že obsah vložený pomocou vlastnosti content bude umiestnený pred položky zoznamu. Tu nastavíme aj hodnotu prírastku počítadla (predvolené je 1). */ counter-increment: li; / * Vlastnosť content zobrazuje číslo položky zoznamu. counters() znamená, že vygenerovaný text predstavuje hodnoty všetkých počítadiel s týmto názvom. Bodka v úvodzovkách pridá oddeľovaciu bodku medzi čísla a pred obsah každej položky zoznamu sa pridá bodka s medzerou */ content: counters(li,".") "."; )
                        Ryža. 5. Viacúrovňový číslovaný zoznam

                    HTML podporuje zoznamy troch odlišné typy, z ktorých každý má svoje vlastné parametre:

                      1. – očíslovaný (pomocou číslic alebo písmen) zoznam, ktorého každý prvok má poradové číslo (písmeno);
                        • – zoznam s odrážkami (nie očíslovaný), vedľa každého prvku je umiestnená značka (namiesto číselných alebo abecedných znakov označujúcich poradové číslo);
                        • – zoznam definícií pozostáva z párov názov/hodnota vrátane termínov a definícií.

                        Číslované zoznamy

                        Do očíslovaného zoznamu prehliadač automaticky vkladá čísla prvkov v poradí, počnúc určitou hodnotou (zvyčajne 1). To vám umožní vkladať a mazať položky zoznamu bez narušenia číslovania, pretože zostávajúce čísla sa automaticky prepočítajú.
                        Číslované zoznamy sa vytvárajú pomocou prvku bloku

                          (z anglického Ordered List - číslovaný zoznam). Vedľa kontajnera
                            pre každú položku zoznamu je umiestnený prvok
                          1. (z anglického List Item – položka zoznamu). Predvolený je očíslovaný zoznam s arabskými číslami.
                            Tag
                              má nasledujúcu syntax:

                              1. prvok 1
                              2. prvok 2
                              3. prvok 3

                              Položky číslovaného zoznamu musia obsahovať viacero položiek zoznamu, ako je znázornené v nasledujúcom príklade:

                              Príklad: Číslovaný zoznam

                              • Skúste to sami"

                              Pokyny krok za krokom

                              1. Získajte kľúč
                              2. Vložte kľúč do zámku
                              3. Otočte kľúčom o dve otáčky
                              4. Vytiahnite kľúč zo zámky
                              5. Otvor dvere

                              Pokyny krok za krokom

                              1. Získajte kľúč
                              2. Vložte kľúč do zámku
                              3. Otočte kľúčom o dve otáčky
                              4. Vytiahnite kľúč zo zámky
                              5. Otvor dvere

                              Niekedy pri pohľade na existujúce HTML kódy narazíte na argument typu v prvku

                                , ktoré sa používa na označenie typu číslovania (písmená, rímske a arabské číslice a pod.). Syntax:

                                  Tu: typ – zoznam symbolov:

                                  • A - veľké latinské písmená (A, B, C...);
                                  • a - malé latinské písmená (a, b, c...);
                                  • I - veľké rímske číslice (I, II, III...);
                                  • i - malé rímske číslice (i, ii, iii...);
                                  • 1 - Arabské číslice (1, 2, 3 . . .) (štandardne používané).

                                  Ak chcete, aby zoznam začínal iným číslom ako 1, mali by ste to zadať pomocou atribútu začať tag

                                    .
                                    Nasledujúci príklad zobrazuje očíslovaný zoznam s veľkými rímskymi číslicami a počiatočnou hodnotou XLIX:

                                    Číslovanie je možné spustiť aj pomocou atribútu hodnotu, ktorý sa pridáva k prvku

                                  1. nasledujúcim spôsobom:

                                  2. V tomto prípade sa postupné číslovanie zoznamu preruší a od tohto bodu začne číslovanie znova, v tomto prípade od sedmičky.

                                    Príklad použitia atribútu hodnotu tag

                                  3. , ktorý vám umožňuje zmeniť číslo daného prvku zoznamu:

                                    V tomto príklade by „Prvá položka zoznamu“ mala číslo 1, „Druhá položka zoznamu“ by mala číslo 7 a „Tretia položka zoznamu“ by mala číslo 8.

                                    Formátovanie číslovaných zoznamov pomocou CSS

                                    Ak chcete zmeniť čísla zoznamu, mali by ste použiť vlastnosť list-style-type CSS štýly:

                                      Štýly číslovaného zoznamu
                                      PríkladVýznamPopis
                                      a, b, cnižšia-alfaMalými písmenami
                                      A, B, Chorná alfaVeľké písmená
                                      i, ii, iiinižšia rímskaRímske číslice malými písmenami
                                      I, II, IIIhorný románRímske číslice veľkými písmenami

                                      Príklad: Použitie vlastnosti CSS list-style-type

                                      Zoznamy s odrážkami

                                      Zoznamy s odrážkami sú v podstate podobné číslovaným zoznamom, len neobsahujú postupné číslovanie položiek. Zoznamy s odrážkami sa vytvárajú pomocou prvku bloku

                                        (z anglického Unordered List – nečíslovaný zoznam). Každý prvok zoznamu, rovnako ako v číslovaných zoznamoch, začína značkou
                                      • . Prehliadač odsadí každú položku zoznamu a automaticky zobrazí odrážky.
                                        Tag
                                          má nasledujúcu syntax:

                                          • Prvý bod
                                          • Druhý bod
                                          • Tretí bod

                                          V nasledujúcom príklade môžete vidieť, že v predvolenom nastavení sa pred každú položku zoznamu pridá malá značka vo forme vyplneného kruhu:

                                          Vo vnútri štítku

                                        • Nie je potrebné umiestňovať iba text, je prijateľné umiestniť akýkoľvek prvok streamovaného obsahu (odkazy, odseky, obrázky atď.)

                                          Vnorené zoznamy

                                          Každý zoznam môže byť vnorený do iného. Vo vnútri prvku
                                        • Je povolené vytvoriť vnorený zoznam alebo zoznam druhej úrovne. Ak chcete vnoriť zoznam, opíšte nový zoznam vo vnútri prvku
                                        • už existujúci zoznam. Keď vnoríte jeden zoznam s odrážkami do druhého, prehliadač automaticky zmení štýl odrážok pre zoznam druhej úrovne. Každý zoznam môže byť vnorený do iného. Nasledujúci príklad ukazuje štruktúru zoznamu s odrážkami vnoreného do druhej položky číslovaného zoznamu.

                                          Príklad: Vnorené zoznamy

                                          • Skúste to sami"
                                          • pondelok
                                            1. Poslať mail
                                            2. Návšteva redakcie
                                              • Výber témy
                                              • Dekoratívny dizajn
                                              • Posledná správa
                                            3. Večerné prezeranie správ
                                          • utorok
                                            1. Revidovať rozvrh
                                            2. Posielajte obrázky
                                          • streda...

                                          • pondelok
                                            1. Poslať mail
                                            2. Návšteva redakcie
                                              • Výber témy
                                              • Dekoratívny dizajn
                                              • Posledná správa
                                            3. Večerné prezeranie správ
                                          • utorok
                                            1. Revidovať rozvrh
                                            2. Posielajte obrázky
                                          • streda...

                                          Formátovanie zoznamov s odrážkami

                                          Pre zmenu vzhľad mala by sa použiť vlastnosť značky zoznamu list-style-type CSS štýly:

                                            Nasledujúci príklad ukazuje rôzne štýly zoznamov s odrážkami:

                                            Príklad: Štýly zoznamu odrážok

                                            • Skúste to sami"
                                            • Káva
                                            • Káva
                                            • Káva
                                            • Káva

                                            disk:

                                            • Káva
                                            • Mlieko

                                            Kruh:

                                            • Káva
                                            • Mlieko

                                            Námestie:

                                            • Káva
                                            • Mlieko

                                            Žiadne:

                                            • Káva
                                            • Mlieko

                                            Grafické značky.

                                            V HTML je možné vytvárať zoznam s grafickými značkami. Jedna vec je, keď sú značkami zoznamu štandardné kruhy alebo štvorce, a iná vec, keď vývojár vyberie značku v súlade s dizajnom stránky. Aby boli položky zoznamu krásne, často sa používajú malé obrázky.
                                            Ak chcete nahradiť bežnú značku grafickou, nahraďte vlastnosť list-style-type na nehnuteľnosť list-style-image a uveďte adresu URL obrázka:

                                              Príklad: Grafické značky

                                              • Skúste to sami"

                                              Znamenia zverokruhu

                                              • Býk
                                              • Blíženci

                                              Znamenia zverokruhu

                                              • Baran
                                              • Býk
                                              • Blíženci

                                              Zoznamy definícií (popisy)

                                              Zoznamy definícií sú veľmi užitočné pri vytváraní napríklad vášho osobného slovníka pojmov. Každá položka zoznamu definícií má dve časti: pojem a jeho definíciu.
                                              Celý zoznam vložíte do prvku

                                              (z anglického Definition List - zoznam definícií). Obsahuje značky
                                              (z anglického Definition Term - definované slovo, pojem) a
                                              (z anglického Definition Description - popis definovaného pojmu).
                                              Zoznamy definícií sa často používajú vo vedeckých, technických a vzdelávacích publikáciách a používajú ich na zostavovanie slovníkov, slovníkov, referenčných kníh atď.

                                              Všeobecná štruktúra zoznamu popisov je nasledovná:

                                              Prvý termín
                                              Popis prvého termínu
                                              Druhý termín
                                              Opis druhého termínu

                                              Nasledujúci príklad ukazuje jeden z možné využitie zoznam definícií:

                                              Príklad: Zoznam definícií

                                              • Skúste to sami"

                                              World Wide Web – z angličtiny. World Wide Web (WWW) je distribuovaný systém, ktorý poskytuje prístup k súvisiacim dokumentom umiestneným na rôznych počítačoch pripojených k internetu. Internet je súbor sietí, ktoré na prenos informácií používajú jeden výmenný protokol. Webstránka je súbor jednotlivých webových stránok, ktoré sú navzájom prepojené odkazmi a jednotným dizajnom.

                                              Celosvetový web
                                              - z angličtiny World Wide Web (WWW) je distribuovaný systém, ktorý poskytuje prístup k súvisiacim dokumentom umiestneným na rôznych počítačoch pripojených k internetu.
                                              internet
                                              — súbor sietí, ktoré na prenos informácií používajú jeden výmenný protokol.
                                              webové stránky
                                              - súbor jednotlivých webových stránok, ktoré sú navzájom prepojené odkazmi a jednotným dizajnom.

                                              Štandardne je text výrazu stlačený na ľavý okraj okna prehliadača a popis výrazu je umiestnený nižšie a posunutý doprava.

                                              Číslované zoznamy sú kolekciou prvkov s ich sériovými číslami. Typ a typ číslovania závisí od parametrov prvku

                                                , ktorý sa používa na vytvorenie zoznamu. Nasledujúce hodnoty môžu slúžiť ako prvky číslovania:

                                                • arabské číslice (1, 2, 3, ...);
                                                • arabské číslice s nulou na začiatku pre čísla menšie ako desať (01, 02, 03, ...,10);
                                                • veľké latinské písmená (A, B, C, ...);
                                                • malé latinské písmená (a, b, c, ...);
                                                • veľké rímske číslice (I, II, III, ...);
                                                • malé rímske číslice (i, ii, iii, ...);
                                                • arménske číslovanie;
                                                • Gruzínske číslovanie.

                                                Z praktického hľadiska možno princípy zobrazovania položiek v odrážkovom zozname aplikovať podobne ako pri číslovanom zozname. Ale vzhľadom na to, že máme čo do činenia s enumeráciou, existujú niektoré funkcie, o ktorých sa bude diskutovať ďalej.

                                                Číslovanie zoznamu

                                                Je povolené začať zoznam z ľubovoľného čísla; Na tento účel sa používa štartový atribút prvku

                                                  alebo hodnotu prvku
                                                1. . Hodnota je akékoľvek kladné celé číslo. Nezáleží na tom, aký typ číslovania je nastavený, aj keď sa ako zoznam používajú latinské písmená. Ak sa na zoznam použijú naraz atribúty začiatku aj hodnoty, potom má prednosť druhý a číslovanie sa zobrazí od čísla určeného hodnotou , ako je uvedené v príklade 1.

                                                  Príklad 1: Zmena číslovania zoznamu

                                                  zoznamy

                                                  1. O svoje pracovisko by ste sa mali dobre starať.
                                                  2. Upravte osvetlenie v miestnosti tak, aby bol zdroj svetla umiestnený na boku alebo za operátorom.
                                                  3. Aby ste predišli zdravotným komplikáciám, odporúča sa vybrať stoličku s mäkkým sedadlom.

                                                  Prvý prvok zoznamu v tomto príklade bude začínať rímskou číslicou IV, pretože je zadaný atribút start="4", potom nasleduje číslo V a posledný prvok je mimo poradia a je mu priradené číslo X (obrázok 1).

                                                  Ryža. 1. Rímske číslice v zozname

                                                  Písanie čísel

                                                  Číslovaný zoznam má štandardne určitý vzhľad: najprv je číslo, potom bodka a potom sa text zobrazí oddelený medzerou. Táto forma písania je vizuálna a pohodlná, ale niektorí vývojári uprednostňujú iný spôsob navrhovania číslovania zoznamov. Totiž tak, že namiesto bodky je tu uzatváracia zátvorka, ako je znázornené na obr. 2 alebo niečo podobné.

                                                  Ryža. 2. Číslovaný zoznam so zátvorkou

                                                  Štýly vám umožňujú zmeniť typ číslovania zoznamu pomocou vlastností obsahu a protiprírastku. Najprv je potrebné nastaviť volič ol na counter-reset : položka , je to potrebné, aby číslovanie v každom novom zozname začalo odznova. V opačnom prípade bude číslovanie pokračovať a namiesto 1,2,3 uvidíte 5,6,7. Hodnota položky je jedinečný identifikátor pre počítadlo, vyberáme si ju sami. Ďalej musíte skryť pôvodné značky prostredníctvom vlastnosti štýlu list-style-type s hodnotou none .

                                                  Vlastnosť content zvyčajne funguje v spojení s pseudoprvkami ::after a ::before. Konštrukcia li::before teda hovorí, že pred každý prvok zoznamu musí byť pridaný nejaký obsah (príklad 2).

                                                  Príklad 2. Vytvorenie vlastného číslovania

                                                  Li::before ( content: counter(item) ") "; /* K číslam pridáme zátvorku */ counter-increment: item; /* Nastavte názov počítadla */ )

                                                  Vlastnosť content s hodnotou counter(item) zobrazuje číslo; Pridaním zátvorky, ako je znázornené v tomto príklade, získame požadovaný typ číslovania. na zvýšenie čísla zoznamu o jeden je potrebný protiprírastok. Všimnite si, že v celom texte sa používa rovnaký identifikátor s názvom item . Konečný kód je uvedený v príklade 3.

                                                  Príklad 3: Zmena zobrazenia zoznamu

                                                  zoznamy

                                                  1. najprv
                                                  2. Po druhé
                                                  3. Po tretie
                                                  4. Po štvrté

                                                  Pomocou vyššie uvedenej metódy môžete vytvoriť ľubovoľný typ číslovaného zoznamu, napríklad vložiť číslo do hranatých zátvoriek, v tomto prípade sa v štýloch zmení iba jeden riadok.

                                                  Obsah: "[" counter(item) "] ";

                                                  Zoznam s ruskými písmenami

                                                  Existuje očíslovaný zoznam s latinskými písmenami, ale v zozname nie sú žiadne ruské písmená. Môžu byť pridané umelo pomocou vyššie uvedenej techniky. Keďže číslovanie prebieha cez štýly, samotný zoznam zostáva pôvodný, pridáva sa doň len vybraná trieda, nazvime ju cyrilou (príklad 4).

                                                  Príklad 4: Kód na vytvorenie zoznamu

                                                  1. Jeden
                                                  2. Dva
                                                  3. Tri

                                                  Pridávanie písmen sa vykonáva pomocou pseudoprvku ::before a vlastnosti content. Keďže každý riadok musí mať svoje vlastné písmeno, použijeme pseudotriedu :nth-child(1) , pričom číslo písmena bude napísané v zátvorkách. Prvé písmeno je prirodzene A, druhé je B, tretie je C atď. Celá táto sada sa pridá do voliča li nasledovne (príklad 5).

                                                  Príklad 5: Použitie pseudo-triedy:n-té dieťa

                                                  Cyrilické li:nth-child(1)::before (obsah: "a)"; ) .cyrilika li:n-té-dieťa(2)::pred (obsah: "b)"; ) .cyrilika li:nth-child(3)::before ( content: "at)"; )

                                                  V tomto príklade za každým písmenom nasleduje zátvorka, všetky písmená sú malé. Môžete si definovať vlastný typ číslovania zoznamov, môže napríklad obsahovať veľké písmená s bodkou, s jednou alebo dvoma zátvorkami alebo len písmená. Na rozdiel od štandardného číslovania si tu môžeme robiť, čo chceme. Zoznam desiatich písmen by mal stačiť takmer na všetky situácie, no ak sa zrazu ukáže, že to nestačí, nič nám nebráni v rozšírení nášho zoznamu aspoň o všetky písmená ruskej abecedy.

                                                  Nakoniec upravíme zarovnanie a polohu písmen, prípadne určíme veľkosť písma, farbu a ďalšie parametre (príklad 6).

                                                  Príklad 6. Zoznam s ruskými písmenami

                                                  Zoznam

                                                  1. Boršč
                                                  2. Kotlety zo šťuky
                                                  3. Kulebyaka
                                                  4. Huby v kyslej smotane
                                                  5. Palacinky s kaviárom
                                                  6. Kvas

                                                  Výsledok tento príklad znázornené na obr. 3.