Ak sa pozriete na HTML označenie pre ktorúkoľvek webovú stránku dnes uvidíte prvky HTML obsiahnuté v iných prvkoch HTML. Tieto prvky, ktoré sú „vnútri“ ostatných prvkov, sú známe ako vnorené prvkya sú dnes nevyhnutné pre tvorbu akejkoľvek webovej stránky.
Čo to znamená vnoriť značky HTML?
Najjednoduchší spôsob, ako pochopiť hniezdenie, je myslieť na to HTML tagy ako polia, ktoré obsahujú váš obsah. Váš obsah môže obsahovať text, obrázky a súvisiace médiá. Značky HTML sú polia okolo obsahu. Niekedy musíte umiestniť škatule do iných škatúľ. Tieto „vnútorné“ boxy sú vložené do ostatných.
Ak máte v odseku blok textu, ktorý má byť zvýraznený tučným písmom, bude mať dva Prvky HTML ako aj samotný text.
Príklad: Toto je textová veta.
Tento text použijeme ako príklad. Takto by to bolo napísané v HTML:
Príklad: Toto je textová veta.
Aby bolo slovo veta tučným písmom, pridajte pred a za toto slovo otváracie a zatváracie značky.
Príklad: Toto je a veta textu.
Ako vidíte, máme jedno políčko (odsek), ktoré obsahuje obsah vety, a druhé políčko (písmeno)
silný dvojica značiek), ktorá toto slovo vykreslí tučným písmom.Keď vnoríte značky, zatvorte ich v opačnom poradí, v akom ste ich otvorili. Otvoríš
najskôr nasleduje , čo znamená, že to zvrátite a zatvoríte a potom.
Ďalším spôsobom, ako o tom premýšľať, je opäť použiť obdobu škatúľ. Ak umiestnite škatuľu do inej škatule, musíte najskôr uzavrieť vnútornú, aby ste mohli zavrieť vonkajšiu alebo obsahujúcu škatuľu.
Pridanie ďalších vnorených značiek
Čo ak chcete, aby boli iba jedno alebo dve slová tučným písmom a ďalšia sada kurzívou? Takto to môžete urobiť.
Príklad: Toto je a veta textu a má aj nejaké kurzíva tiež.
Môžete vidieť, že naša vonkajšia skrinka,
, má teraz v sebe dve vnorené značky - znak a . Obe musia byť zatvorené predtým, ako bude možné uzavrieť schránku obsahujúcu škatuľu.
Príklad: Toto je a veta textu a má aj nejaké kurzíva tiež.
Toto je ďalší odsek.
V takom prípade máme vnútri krabičiek boxy! Najvzdialenejšou krabičkou je
alebo a. rozdelenie. Vo vnútri tohto boxu je pár vnorených. značky odsekova vo vnútri prvého odseku máme ďalší. a dvojica značiek.Prečo by ste sa mali starať o hniezdenie
Hlavným dôvodom, prečo by ste sa mali starať o vnorenie, je to, že ak budete používať CSS. Kaskádové štýly spoliehajte sa na to, že značky budú v dokumente konzistentne vnorené, aby bolo možné určiť, kde sa štýly začínajú a končia. Nesprávne vnorenie sťažuje prehľadávaču, kde má tieto štýly použiť. Pozrime sa na niektoré HTML:
Príklad: Toto je a veta textu a má aj nejaké kurzíva tiež.
Toto je ďalší odsek.
Pomocou vyššie uvedeného príkladu, ak by sme chceli napísať a Štýl CSS ktoré by ovplyvnili odkaz v tomto rozdelení a iba na tento odkaz (na rozdiel od iných odkazov v iných častiach stránky) by sme na napísanie tohto štýlu museli použiť vnorenie:
.main-content a {
farba: # F00;
}
Ďalšie úvahy
Dôležitá je tiež dostupnosť a kompatibilita prehliadača. Ak je váš HTML nesprávne vnorený, nebude taký prístupný pre čítačky obrazovky a staršie prehliadače - a dokonca by mohol úplne rozbiť vizuálny vzhľad stránky, ak prehliadače nemôžu zistiť, ako správne vykresliť stránku, pretože prvky HTML a značky sú mimo miesto.
Nakoniec, ak sa snažíte písať úplne správne a platné HTML, budete musieť použiť správne vnorenie. V opačnom prípade každý overovateľ označí váš kód HTML ako nesprávny.