Základné HTML tágy

obrazok

Najdôle?itej?ie tágy v HTML sú tágy, ktoré definujú hlavi?ky, odstavce a zalomenia riadkov.

Najlep?ia cesta, ako sa nau?i? HTML, je pracova? s príkladmi. Vytvoril som ve?mi dobrý on-line HTML editor pre vás. S týmto editorom mô?ete editova? zdrojový HTML kód, ak chcete, a kliknú? na "OTESTUJ MA" tla?ítko, aby ste videli výsledok.


Try it Yourself (skús si to sám) - Príklady

Ve?mi jednoduchý HTML dokument
Tento príklady je jednoduchý HTML dokument, len s minimálnym po?tom tágom. Predvádza, ako je text vnútri body tágu zobrazený v prehliada?i. 

Jednoduché odstavce
Tento príklad predvádza, ako je text vnútri odstavcového tágu zobrazený v prehliada?i.

(Viac príkladov nájdete na spodku tejto stránky)


Hlavi?ky

Hlavi?ky sú definované s <h1> a? <h6> tágmi. <h1> definuje najvä??iu hlavi?ku, <h6> najmen?iu.

<h1>Toto je hlavi?ka</h1>
<h2>Toto je hlavi?ka</h2>
<h3>Toto je hlavi?ka</h3>

<h4>Toto je hlavi?ka</h4>
<h5>Toto je hlavi?ka</h5>
<h6>Toto je hlavi?ka</h6>

HTML automaticky pridáva extra riadok pred a za hlavi?ku.


Odstavce

Odstavce sú definované s <p> tágom.

<p>Toto je odstavec</p>
<p>Toto je iný odstavec</p>

HTML automaticky pridáva extra riadok pred a ze odstavec.


Nezabudnite uzatvori? tág!

Mo?no ste pozaznamenali, ?e odstavce mô?u by? písané bez koncových tágov </p>:

<p>Toto je odstavec
        <p>Toto je iný odstavec

Tento príklad hore bude fungova? vo vä??ine prehliada?ov, ale nespoliehajte sa na to. Budúca verzia HTML vám nepovolí vynecha? ?IADNY koncový tág.

Uzatvorenie v?etkých HTML tágov je poistka do budúcna v písaní HTML. Taktie? to robí kód ?ah?ím na ?ítanie (?ítajte a prechádzajte) ak si v?imnete oboje - za?iatok aj koniec tágu.


Zalomenia riadkov

<br> tág sa pou?íva, ak chceme zalomi? riadok, ale neza?ne nový odstavec. <br> sa usiluje o zalomenie riadku, hocikde ho vlo?íte.

<p>Toto <br> je od<br>stavec so zalomeným riadkom.</p>

Try it yourself!

<br> tág je nepárový (prázdny) tág. Nemá ?iadny koncový tág, ako je </br>, kvôli tomu uzatvorenie tohto tágu nemá ?iadny význam.


<br> alebo <br />

Viac ?astej?ie uvidíte <br> tág napísaný, ako tento: <br />

Preto?e <br> tág nemá ?iadny koncový tág (alebo uzatvárací tág), lomí to jedno pravidlo budúcnosti HTML (XHTML zalo?ené na XML), konkrétne to, ?e v?etky tágy v XHTML dokumente musia by? uzatvorené.

Napísaním <br /> je budúca poistka uzatvorenia (alebo ukon?enia) tágu vnútri otvoreného tágu, akceptovaná obomi - XML aj HTML jazykmi.


Komentáre v HTML

Komentárový tág sa pou?íva na vlo?enie komentára do zdrojového kódu HTML. Komentár bude ignorovaný Web prehliada?om (browserom). Mô?eme pou?i? komentáre na vysvetlenie ná?ho kódu, ?o nám mô?e pomôc?, ke? budeme niekedy v budúcnu upravova? ná? kód.

<!-- Toto je komentár -->

Pozna?te si, ?e potrebujete výkri?ník za prvou rohovou zátvorkou, ale nie pred koncovou rohovou zátvorkou


Rekapitulácia o HTML elementoch

  • Ka?dý HTML element má nejaký názov elementu (body, h1, p, br)
  • ?tartovací tág je názov, obklopený rohovými (?picatými) zátvorkami: <h1>
  • Koncový tág je lomítko a názov elementu obklopený ?picatými zátvorkami </h1>
  • Obsah elementu sa vyskytuje medzi za?iato?ným a koncovým tágom
  • Niektoré HTML elementy nemajú ?iadny obsah
  • Niektoré HTML elementy nemajú ?iadny koncový tág

Základné poznámky - vhodné tipy

Ak pí?ete HTML text, nikdy si nemô?ete by? istí, ako bude ten text zobrazený v inom prehliada?i. Niektorí ?udia majú ve?ké obrazovky, niektorí malé. Text bude preformátovaný ka?dýkrát, ke? si u?íva?e? zmení rozli?enie obrazovky. Nikdy neskú?ajte formátova? text vo va?ich editoroch, pridaním riadkov a medzierdo textu.

HTML vypustí medzere vo va?ich textoch. Ka?dý po?et medzier sa ráta za jednu medzeru. Extra informácia: V HTML sa nový riadok ráta ako medzera. 

Pou?itím prázdnych odstavcov <p>, na vlo?enie prázdnych riadkov je zlozvyk. Namiesto toho pou?ite <br> tág. (Ale nepou?ite <br> tág na vytvorenie odrá?ok. Po?kajte si, a? sa nenau?íte o HTML odrá?kach.)

HTML automaticky pridáva extra prázdny riadok pred a za elementy, ako pred a za odstavec a pred a za hlavi?ku.

Pou?ívam horizontálnu ?iaru (horizontal rule) (<hr> tág), na oddelenie sekcií v týchto tutoriáloch.


Viac príkladov

Viac odstavcov
Tento príklad predvádza nejaké defaultné (pôvodné) správania odstavcových elementov.

Zalomenia riadkov
Tento príklad predvádza, ako pou?i? zalomenia riadkov v HTML dokumente.

Problémy s pojmami
Tento príklad predvádza zopár problémov pri formátovaní HTML dokumentu.

Hlavi?ky
Tento príklad predvádza pou?itie tágov, ktoré majú zobrazi? hlavi?ky v HTML dokumente.

Horizontálna ?iara
Tento príklad predvádza, ako vlo?i? horizontálnu ?iaru do HTML dokumentu.

Skované komentáre
Tento príklad predvádza, ako vlo?i? skovaný komentár do zdrojového kódu HTML dokumentu.


Základné HTML tágy

Ak si prezriete HTML tágy zo zdroja dole, zistíte, ?e tento zdroj obsahuje prídavné informácie o ich atribútoch.

Viac o HTML atribútoch sa nau?íte v ?al?ej lekcií tejto ?koly.

Tág Popis
<html> Definuje HTML dokument
<body> Definuje telo HTML dokumentu
<h1> a? <h6> Definuje hlavi?ka 1 a? 6
<p> Definuje odstavec
<br> Zalomí riadok
<hr> Definuje horizontálnu ?iaru (x-ovú)
<!--> Definuje komentár

obrazok