Bloky

Vše, za čím se zalamuje řádka (kromě seznamů a tabulek). Jde o různé oddíly textu a odstavce.

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. Původně šlo o tag nepárový, ale postupně se začala používat i značka </p>, která tag ukončila. Novější specifikace vyžadují ukončovací tag.

Text nového odstavce vždy začíná nový řádek a konec odstavce končí řádek. Klasický odstavec v HTML má před sebou a za sebou navíc vertikální mezeru, která většinou přesně odpovídá výšce jednoho řádku, což odpovídá anglosaské normě. (Této mezery se lze zbavit pomocí CSS stylu <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á.

Tag <p> je velmi často používán HTML editory.

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. Nejen proto používání tagu <p> velmi doporučuji.

Příklad: <p align="right">Odstavec zarovnaný doprava.</p>

br

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

Je důležité pochopit rozdíl mezi <p> a <br>.

• V zobrazení je jediný rozdíl: <br> kolem sebe nedělá vertikální mezery.
• Z typografického hlediska odpovídá <br> "měkkému entru".
• Pokud je tag <br> použit uprostřed odstavce, další text se považuje za pokračování toho odstavce, nikoli za nový. Takže kupříkladu pokračuje nastavení zarovnání.

V některých wysiwyg editorech se měkký enter vytváří kombinací Shift + Enter nebo Ctrl + Shift + Enter.

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.

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

Poznámka: měl jsem tu dlouho chybu, když jsem místo hodnoty "all" uváděl "both". Spletl jsem si to s CSS. Za upozornění děkuji dopisovatelům RP a PH. 

div

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>).

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).

center

Vycentrování libovolně velkého obsahu. Dosahuje stejného efektu jako <div align=center>. Nedoporučuji jeho používání. Smysl měl pouze v dobách, kdy některé prohlížeče nepodporovaly <div>.

h1 až h6

Nadpisy (angl. heading) jsou vlastně zvláštním druhem odstavců (tag <p>). Je rozlišováno šest stupňů nadpisů. 

Nadpisy se automaticky zobrazují tučně, různým stupněm písma (odpovídá stupni u tagu <font>) a mají kolem sebe vertikální mezery. Není tedy třeba je formátovat ručně.

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

Mnozí autoři pro nadpisy nepoužívají tyto tagy <hx>, ale normální odstavce (tag <p>), kterým nastaví velikost a řez (pomocí tagů <font>, <b> a <i>). To je vcelku chyba, zejména protože si tak přidělávají spoustu práce. Vzhled nadpisů lze snadno předefinovat pomocí CSS.

Text se správně nadefinovanými nadpisy se snáze převádí do jiných formátů (rtp, pdf, doc). Většina HTML editorů umožňuje snadné zadávání nadpisových tagů. Některé programy na základě nadpisů dokáží automaticky vytvářet obsah dokumentu. Některé vyhledávače si také všímají tagů nadpisů a přikládají jejich textu větší váhu.

blockquote

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

<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> přibližně 40 pixelů. Odsazení se zvětší, pokud se tag použije vícekrát za sebou.

Tag <blockquote> nemá žádné zvláštní atributy kromě obecných.

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> s deklarací stylu. Následující dva elementy se tedy zobrazí stejně:

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

address

Vymezení adresy. Další tag, který se časem ukázal být zbytečným. Zobrazuje se stejně jako odstavec, akorát že kurzívou. Nemá žádné atributy.

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.

Příklad: <hr width="50" size="50" color="red" align="center" noshade> zobrazí vycentrovaný červený čtverec.

O tvorbě, údržbě a zlepšování internetových stránek. Základy HTML CSS FrontPage Hledání

HTML  příručka http://dusan.pc-slany.cz/internet/html/

Píše Yuhů: autorova stránka, mail: dusan@pc-slany.cz