Ako HTML tagy hniezdo správne
Ak sa pozriete na značku HTML pre ktorúkoľvek webovú stránku dnes, uvidíte prvky HTML obsiahnuté v iných prvkoch HTML. Tieto prvky, ktoré sú "vnútri" iných, sú známe ako "vnorené elementy" a sú dôležité pre budovanie akejkoľvek webovej stránky dnes.
Čo to znamená HTML tagy hniezda?
Najjednoduchší spôsob, ako pochopiť vnorenie, je premýšľať o značkách HTML ako o rámčekoch, ktoré obsahujú. Váš obsah môže obsahovať text, obrázky atď. Tagy HTML sú rámčeky okolo obsahu. Niekedy musíte umiestniť boxy vnútri iných políčok. Tieto "vnútorné" boxy sú vnorené do iných.
Ak máte blok textu, ktorý chcete vnútri odseku tučným písmom, budete mať dva prvky HTML, ako aj samotný text.
Príklad: Toto je textová veta .Tento text je to, čo budeme používať ako náš príklad. Tu je, ako by to bolo napísané.
Príklad: Toto je veta textu. p>
Pretože chcete, aby slovo "veta" bolo tučné, pridáte začiatočné a zatváracie značky pred a po tomto období.
Príklad: Ide o vetu strong> textu. p>
Ako môžete vidieť, máme jedno políčko (odsek), ktorý obsahuje obsah / text našej vety, plus druhé pole (silný štvorček tagov), ktorý bude robiť toto slovo tučným písmom.
Keď vložíte značky, je veľmi dôležité, aby ste značky zavreli v opačnom poradí, ako ste ich otvorili. Najprv otvoríte
, za ktorým nasleduje , čo znamená, že to zvrátite a zavrite strong> a potom p>.
Ďalším spôsobom, ako zamyslieť sa nad tým, je znova použiť analógiu krabičiek. Ak umiestnite krabicu do inej krabice, musíte zatvoriť vnútornú skrinku, aby ste mohli zatvoriť vonkajšiu alebo obsahujúcu škatuľu.
Pridávanie viacerých vnorených značiek
Čo ak chcete, aby jedno alebo dve slová boli odvážne a iný súbor bol kurzívou? Tu je postup ako to urobiť.
Príklad: Ide o vetu strong> textu a tiež text kurzívou em>. p> Môžete vidieť, že naša vonkajšia schránka, , má teraz vnútri dva vnorené značky - a . Musia byť obe zatvorené predtým, než je možné uzavrieť box s obsahom. Príklad: Jedná sa o vetu strong> textu a má tiež kurzívu em>. p> / p> div> V tomto prípade máme boxy vnútri krabičiek! Najpoužívanejšie pole je Prvým dôvodom, prečo by ste sa mali zaujímať o hniezdenie, je, ak chcete použiť CSS. Kaskádové štýly sa spoliehajú na značky, ktoré majú byť vnorene vnorené do dokumentu, aby dokázali rozpoznať, kde štýly začínajú a končia. Ak nastavíte štýl, ktorý by mal ovplyvniť všetky odkazy, ktoré sa nachádzajú vo vnútri divízie s triedou "hlavného obsahu" textu na stránke, nesprávne vnorenie znemožňuje prehliadaču vedieť, kde tieto štýly používať. Poďme sa pozrieť na niektoré HTML: Príklad: Je to veta strong> textu a má tiež text kurzívu p>. > Toto je ďalší odsek . P> div> Použil som príklad, ktorý som práve uviedol, ak by som chcel napísať štýl CSS, ktorý by ovplyvnil spojenie v rámci tejto divízie a len ten odkaz (na rozdiel od akýchkoľvek iných odkazov v iných častiach stránky), musel by som použiť hniezdenie písať môj štýl, ako také: Medzi ďalšie dôvody patrí dostupnosť a kompatibilita prehliadača. Ak je váš kód HTML nesprávne vnorený, nebude tak prístupný pre čítačky obrazovky a staršie prehliadače - a dokonca by dokonca úplne narušil 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ú na mieste. Nakoniec, ak sa snažíte napísať úplne správny a správny kód HTML, budete musieť použiť správne vnorenie. V opačnom prípade bude každý validátor označený ako nesprávny kód HTML. Prečo by ste mali starať o hniezdenie