Prehľad nových prvkov HTML5
Od roku 1999, keď sa stal štandardom HTML 4.01, sa web a jeho používanie podstatne zmenili. W3C sa rozhodla zmeniť základnú syntax HTML zo štandardného generalizovaného značkovacieho jazyka (SGML) na XML a tiež úplne odlišné značkovacie jazyky, ako je škálovateľná vektorová grafika (SVG), XForms a MathML. V súčasnosti sú niektoré komponenty HTML 4.01 zastarané, nikdy použité alebo nepoužívané podľa očakávania. Každá časť komponentov v HTML5 je premiestnená alebo znovu zložená. HTML5 obsahuje nové prvky na ilustráciu reprezentácie, zobrazovanie digitálneho obsahu, vylepšené rozloženie stránky a celkovú funkčnosť a niekoľko nových rozhraní na správne riešenie dnešných internetových požiadaviek.
HTML5 obsahuje niekoľko nových prvkov, ktoré ponúkajú určité ďalšie funkcie na vývoj žiaduceho a interaktívneho webu. Pomocou týchto komponentov dokážeme rýchlo a efektívne vytvoriť váš kód. Kvôli chýbajúcej štruktúre sa s mnohými dobre tvarovanými dokumentmi HTML narába ťažšie, ako je potrebné. Vyhodnotením mierok hlavičiek musíme zistiť, kam smerujú zlomy segmentov. Element div identifikuje bočné panely, päty, hlavičky, navigačné ponuky a hlavné časti obsahu.
Top 10 nových prvkov HTML5
HTML5 poskytuje nové prvky na zlepšenie rozloženia dokumentu.
1.
Tento prvok určuje časť stránky, ktorá obsahuje samostatnú štruktúru v dokumente, časti alebo webovej stránke a ktorá sa odporúča široko distribuovať alebo použiť. Môže to byť skupina, ktorá pošle denník alebo dennú papierovú správu, podanie do online spravodajcu, poznámka zaslaná zákazníkom alebo akýkoľvek iný predmet neobsahujúci látky.
Príklad:
Article Element
EDUCBA
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) is a leading global provider of skill based education addressing the needs 500, 000+ members across 40+ Countries.
Article Element
EDUCBA
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) is a leading global provider of skill based education addressing the needs 500, 000+ members across 40+ Countries.
Article Element
EDUCBA
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) is a leading global provider of skill based education addressing the needs 500, 000+ members across 40+ Countries.
Article Element
EDUCBA
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) is a leading global provider of skill based education addressing the needs 500, 000+ members across 40+ Countries.
Article Element
EDUCBA
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) is a leading global provider of skill based education addressing the needs 500, 000+ members across 40+ Countries.
Article Element
EDUCBA
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) is a leading global provider of skill based education addressing the needs 500, 000+ members across 40+ Countries.
Výkon:
- Uložte vyššie uvedený kód do súboru s príponou .html.
- Spustite súbor html v prehliadači a získate výstup tak, ako je to znázornené na obrázku nižšie.
2.
Prvok označuje jednotlivý obsah oveľa viac ako kategorizácie, mapy, obrázky, kódové články a mnoho ďalších.
Príklad:
Figure Element
EDUCBA je popredným svetovým poskytovateľom vzdelávania založeného na rozvoji zručností a uspokojuje potreby 500 000+ členov vo viac ako 40 krajinách.
Výkon:
Vyššie uvedený kód vytvorí výstup, ako je znázornené na obrázku nižšie,
3.
Tento prvok sa používa na pridanie popisu obrázka.
Príklad:
Figure Caption Element
EDUCBA je popredným svetovým poskytovateľom vzdelávania založeného na rozvoji zručností a uspokojuje potreby 500 000+ členov vo viac ako 40 krajinách.
EDUCBA (Corporate Bridge Consultancy Pvt Ltd)
Výkon:
Vyššie uvedený kód zobrazuje výsledok zobrazený na obrázku nižšie,
4.
Tento prvok sa používa na zadanie záhlavia dokumentu alebo oddielu na stránke. V jednom dokumente môžete definovať viac ako jednu hlavičku.
Príklad:
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Header Element
Header One
Header Two
Header Three
Obsah dokumentu nájdete tu …
Výkon:
Vyššie uvedený kód zobrazuje výsledok zobrazený na obrázku nižšie,
5.
Tento prvok sa používa na špecifikovanie informácií, ako sú informácie o autorovi, informácie o autorských právach, kontakt, odkazy na súvisiace dokumenty, mapa stránok a mnoho ďalších.
Príklad:
Footer Element
Copyright © 2019 www.educba.com
Kontakt:
Výkon:
Vyššie uvedený kód zobrazuje výsledok zobrazený na obrázku nižšie,
6.
Tento prvok sa používa na zobrazenie hlavných, tj dôležitých informácií dokumentu.
Príklad:
Main Element
Informácie v záhlaví
Hlavné informácie
EDUCBA
EDUCBA je popredným svetovým poskytovateľom vzdelávania založeného na rozvoji zručností …
Informácie o päte
Výkon:
Vyššie uvedený kód vytvorí výstup, ako je znázornené na obrázku nižšie,
7.
Tento prvok sa používa na zvýraznenie alebo označenie textu farbou pozadia, ktorá priťahuje používateľa konkrétnym textom v dokumente.
Príklad:
Mark Element
EDUCBA je popredným svetovým poskytovateľom vzdelávania založeného na rozvoji zručností a uspokojuje potreby 500 000+ členov vo viac ako 40 krajinách.
Výkon:
Vyššie uvedený kód zobrazuje výsledok zobrazený na obrázku nižšie,
8.
Tento prvok sa používa na určenie navigačných odkazov na stránke. Tieto odkazy poskytujú prepojenia na iné stránky v dokumente.
Príklad:
Nav Element
HTML |
CSS |
JAVA |
PHP |
PYTHON
Výkon:
Vyššie uvedený kód vytvorí výstup, ako je znázornené na obrázku nižšie,
9.
Tento prvok sa používa na definovanie samostatnej časti alebo konkrétnej oblasti v dokumente.
Príklad:
Section Element
Main Article
Section Element
Main Article
Section Element
Main Article
Tu sa zobrazí obsah hlavnej hlavičky …
Prvá časť
Zobrazí sa obsah prvej sekcie …
Druhá časť
Zobrazí sa obsah druhej sekcie …
Výkon:
Vyššie uvedený kód zobrazuje výsledok zobrazený na obrázku nižšie,
10.
Značka je podčasťou značky, ktorá poskytuje text, ktorý sa môže zobraziť alebo skryť, keď používateľ klikne na nadpis.
Príklad:
Summary Element
EDUCBA - Corporate Bridge Consultancy Pvt Ltd
Je popredným svetovým poskytovateľom vzdelávania založeného na rozvoji zručností a uspokojuje potreby 500 000+ členov vo viac ako 40 krajinách.
Výkon:
Po spustení vyššie uvedeného kódu sa zobrazí výsledok, ako je uvedené nižšie,
Ako je zobrazené na obrázku, kliknutím na nadpis sa zobrazí skrytý text, ako je to zobrazené na obrázku nižšie,
záver
Doteraz sme videli, ako sú nové prvky HTML5 užitočné pri rôznych úlohách pri vytváraní webovej stránky. Tieto nové prvky čítajú dokument presnejším a štandardnejším spôsobom a vyvíjajú komplexnejšie a efektívnejšie webové aplikácie. Nové prvky HTML5 poskytujú niektoré ďalšie špeciálne funkcie na generovanie interaktívnych webových stránok.
Odporúčané články
Toto je príručka pre nové prvky HTML5. Tu diskutujeme o 10 najdôležitejších prvkoch Html5 na zlepšenie rozloženia dokumentu. Ďalšie informácie nájdete aj v nasledujúcich článkoch -
- Korekcia farieb v After Effects
- Top 6 verzií HTML
- Html5 vs. Html4
- XHTML vs HTML5
- Čo je to most?
- Značky HTML5 Najlepšie 4 značky HTML5