Bloky

Tag	Význam	Párový
p	odstavec	ano
br	řádkový zlom	ne
div	oddíl	ano
center	vycentrování	ano
h1	nadpis 1. úrovně	ano
h2	nadpis 2 úrovně	ano
h3	nadpis 3. úrovně	ano
h4	nadpis 4. úrovně	ano
h5	nadpis 5. úrovně	ano
h6	nadpis 6. úrovně	ano
blockquote	citace, odsazení	ano
pre	předformátovaný text	ano
hr	vodorovná čára	ne

Tok textu

Pokud se text nevejde na řádek, automaticky se zalomí. Slovo, které by se tam nevešlo, se prostě zobrazí na začátku dalšího řádku. Proto není v HTML nutné ukončovat řádky. Stačí pouze vymezit odstavce a jiné bloky textu.

p

Odstavec (angl. paragraph). Základní formátovací tag. Značka <p> se nachází na začátku každého odstavce.

Klasický odstavec v HTML má před sebou a za sebou navíc vertikální mezeru, (Této mezery se lze zbavit pomocí CSS stylu margin, například <p style="margin-top: 0px; margin-bottom: 0px">.) Pokud se vyskytnou za sebou dva odstavce nebo jiné elementy s vertikální mezerou, výška mezery se nesčítá. Podobná mezera se dělá i u jiných blokových prvků, nejčastěji u nadpisů.

Tag <p> je velmi často používán HTML editory jako základní prvek dokumentu.

Texty, které mají odstavce značené pomocí tagu <p>, jsou dobře transformovatelné do jiných formátů a dobře se s nimi pracuje pomocí CSS.

Atribut tagu <p>

Atribut	Význam	Hodnoty
align	zarovnání odstavce	left | right | center | justify

Atribut align u tagů <p>, <div> a u nadpisů

align=	význam	poznámky
left	zarovnání doleva	výchozí hodnota, nemusí se nastavovat
right	zarovnání doprava	pravý okraj textu bude zarovnaný
center	zarovnání na střed
justify	zarovnání do bloku	budou zarovnány oba okraje textu, poslední řádek bude zarovnán doleva

Atribut align u odstavce i u jiných blokových prvků je zastaralý (nahradit CSS stylem text-align).

Další atributy tagu

Atribut	Hodnota	Význam
id	libovolný text	Hodnotou atributu je text (znakový řetězec), který je jednoznačným identifikátorem prvku v dokumentu. Tento atribut využijete třeba při oživování stránek pomocí JavaScriptu.
class	libovolný text	Hodnotou atributu je třída definovaná v tabulce prvků CSS, podle které se prvek zformátuje.
lang	zkratky označující jazyk, např.: en, cz, sk	Hodnotou atributu určujeme jazyk, kterým je psaný obsah odstavce. Podle zvoleného jazyka se aktivují různé konvence používané v konkrétních jazycích (např.: francouzské uvozovky).
dir	rtl	Určuje směr textu zprava doleva.
	ltr	Určuje směr textu zleva do prava.
title	libovolný text	Určuje titulek odstavce, který se v některých prohlížečích zobrazí jako bublinková nápověda po najetí kurzoru na odstavec.
style	příkazy jazyka CSS, např. color : red;	Pomocí tohoto atributu můžete nadefinovat, jak se má zobrazit určitý odstavec. Můžete využít všechny možnosti, které CSS nabízí.

Atributy pro události

Je to sada atributů, které zaručí provedení nějakého algoritmu nebo funkce zapsané jako hodnota atributu po resp. při proběhnutí nějaké události. Atributy povolené pro odstavce a nadpisy.

Povolené atributy spojené s JS v tagu <p></p> a v nadpisech

Atribut	Význam
onclick	Příkazy zadané jako hodnota proběhnou při kliknutí na element (odstavec/nadpis)
ondblclick	Příkazy zadané jako hodnota proběhnou při dvojkliku na element (odstavec/nadpis)
onmousedown	Příkazy zadané jako hodnota proběhnou při stisku tlačítka myši na element (odstavec/nadpis)
onmouseup	Příkazy zadané jako hodnota proběhnou po stisku tlačítka myši (po uvolnění tlačítka) na element (odstavec/nadpis)
onmouseover	Příkazy zadané jako hodnota proběhnou při přejetí kurzoru nad elementem (odstavec/nadpis)
onmousemove	Příkazy zadané jako hodnota proběhnou při pohybu kurzoru nad elementem (odstavec/nadpis)
onmouseout	Příkazy zadané jako hodnota proběhnou poté, co kurzor opustí prostor nad elementem (odstavec/nadpis)
onkeypress	Příkazy zadané jako hodnota proběhnou při stisku klávesy na klávesnici
onkeydown	Příkazy zadané jako hodnota proběhnou při pohybu klávesy dolů (událost nastane ještě před úplným stisknutím klávesy)
onkeyup	Příkazy zadané jako hodnota proběhnou při pohybu klávesy nahoru (událost nastane až při návratu klávesy do nestisknutého stavu)

br

Řádkový zlom (angl. break). Způsobuje okamžité ukončení řádku. Další text pokračuje na nové řádce.

Clear

Jako jediný HTML tag má <br> atributy reagující na plovoucí (obtékané) objekty. Obtékanými objekty jsou nejčastěji obrázky nebo tabulky zarovnané k jedné straně. Vložením <br> s atributem clear se dá nastavit, aby se další text zobrazil až tam, kde zobrazení řádků nebude ovlivňováno případnými obtékanými objekty.

Tag <br>, atribut clear

clear=	význam
right	Text čeká na ukončení objektů u pravého okraje
left	Text čeká na ukončení objektů u levého okraje
all	Text čeká na ukončení objektů u obou okrajů

Příklad: <img align="right" alt="obrázek zarovnaný vpravo"><br clear="right">Text začíná až pod obtékaným obrázkem.

Atribut clear u tagu <br> je zastaralý a nahrazuje se CSS vlastností clear. Clear přes CSS se dá nastavit libovolnému prvku (ne pouze tagu <br>). Pozor, v CSS není hodnota all, ale both.

div

Div je neutrální tag – nedává obsahu v HTML dokumentu význam a sam o sobě nijak HTML dokument neformátuje.

Div se nejčastěji překládá jako oddíl. Zahrnuje v sobě libovolně velkou oblast textu včetně nadpisů, obrázků a tabulek. Nezřídka se celá stránka vyskytuje uvnitř jednoho elementu <div>

Před a za oddílem se zalomí řádek. V tomto smyslu je <div> velmi podobný odstavci (<p>). Narozdíl od odstavce ale <div> nedělá před a za sebou vizuální mezery (aneb má nulový výchozí margin).

Tag <div> byl do HTML přidán zejména kvůli kaskádovým stylům. V tom se zase podobá tagu <span>, který také přibyl kvůli stylům. Rozdíl mezi <div> a <span> je v tom, že <div> je blokový element (způsobuje zalomení řádku před a po), kdežto <span> je in-line element (řádkový).

Kromě obecných atributů (v případě <div> velmi důležitých) lze použít atribut align (zarovnání), které má stejné hodnoty jako v případě tagu <p> (odstavce).

Atributy tagu <div>

Atribut	Význam	Hodnoty
align	zarovnání textu, zastaralý atribut	left | right | center | justify

center

Vycentrování libovolně velkého obsahu. Dosahuje stejného efektu jako <div align="center">. Nepoužívat.Nahradit divem s CSS stylem Text-align: center.

h1 až h6

Nadpisy (angl. heading). Je rozlišováno šest stupňů nadpisů.

Nadpisy se automaticky zobrazují tučně, různým stupněm písma a mají kolem sebe vertikální mezery.

Výchozí formátování nadpisů

Tag	Stupeň písma	Výchozí velikost	Využití
h1	6	24px	Hlavní nadpis stránky
h2	5	18 -19px	Podnadpisy, názvy kapitol
h3	4	16px	Mezinadpisy
h4	3	13px	Důležitější odstavce
h5	2	10px	Žádné rozumné použití
h6	1	9px	Nejde ani pořádně přečíst

Tagy <h1> až <h6> mají jediný atribut (kromě obecných): align se stejnými hodnotami, jako má odstavec.

Vzhled nadpisů lze snadno předefinovat pomocí CSS.

blockquote

Bloková citace, která se původně používala pro delší kusy citací (na rozdíl od krátkých, které realizoval tag <cite>). Moderní specifikace doporučují pro citaci použít tagu <q>.

<blockquote> se zobrazuje jako odstavec s větším levým a pravým odsazením (odsazení znamená, že je po okrajích odstavce prázdné místo). Díky odsazení se tag <blockquote> v praxi používá ani ne tak pro citaci, jako spíše pro odsazení. V dnešních prohlížečích je odsazení <blockquote> zpravidla 40 pixelů. Odsazení se zvětší, pokud se tag použije vícekrát za sebou.

Tag <blockquote> má kromě obecných atributů ještě atribut cite, který udává url dokumentu, z nějž je citováno. Atribut cite se v dokumentu nijak neprojeví (nejde např. prokliknout), takže se moc nepoužívá.

Příklad použití cite: <blockquote cite="http://www.seznam.cz">Najdu tam, co neznám</blockquote>

Před příchodem CSS byl tag <blockquote> jediným způsobem, jak odsadit odstavec. Dnes doporučuji raději použití normálního odstavce <p> nebo oddílu <div> s deklarací stylu margin nebo margin-left. Následující dva elementy se zobrazí stejně:

<blockquote>Odsazení blokovou citací </blockquote>

<p style="margin-left: 40px; margin-right: 40px">Odsazení pomocí stylu</p>

pre

Předformátovaný text. Tento tag umožňuje rychlé publikování textových souborů, které už jsou formátované pomocí mezer a konců řádek.

Uvnitř tagu <pre> totiž neplatí základní pravidlo HTML syntaxe, které konec řádku bere jako mezeru a skupinu mezer chápe jako mezeru jednu. Takže případné násobné mezery a konce řádků se v prohlížeči zobrazí stejně jako ve zdroji.

Případný konec řádku bezprostředně po značce <pre> a před značkou </pre> je zanedbáván, aby nevznikaly nežádoucí vertikální mezery.

Aby se písmenka zarovnávala pod sebe, zobrazují prohlížeče předformátovaný text neproporcionálním písmem (nejčastěji Courier), které má všechny znaky stejně široké. Zobrazení fontu se dá předefinovat pomocí CSS.

hr

Vodorovná čára (angl. horizontal rule). Bez atributů se zobrazí stínovaně šedá přes celou šířku stránky. Atributy ale mohou její vzhled ovlivnit.

Atributy tagu <hr>

Atribut	Význam	Možné hodnoty
width	šířka (horizontálně)	délka nebo procento
size	šířka ve smyslu tloušťky	délka v pixelech
align	zarovnání čáry s nastavenou šířkou	left, center, right
color	barva (pouze v IE)	barva
noshade	čára bude bez stínu	bez hodnoty

Příklad: <hr width="50" size="50" color="red" align="center" noshade> zobrazí vycentrovaný červený čtverec. Starší verze Mozilly a Opera neumějí změnit barvu, vykreslují vždy tmavě šedou. Novější Firefox barvu zadanou přes atribut color umí, ale nezvládá obarvení stylem.

Vertikální čára se v čistém HTML udělat nedá, resp. neexistuje na to tag. V praxi se vertikální čára dělá tak, že se nějakému tagu, nejčastěji tagu <div>, přidá pravý nebo levý okraj pomocí CSS stylu border (resp. jeho variant border-left, border-right apod.).