Tvorba stránky v HTML

<html>

<head>

<title>Má druhá stránka</title>

</head>

<body>

<h1>Nadpis</h1>

<p>Odstavec s <b>tučným textem</b>, s <i>kurzivou</i>.

<div style="color: red;">Červený text.</div></p>

<h2>Nadpis druhé úrovně</h2>

<p>Odstavec s <i><b>tučnou kurzivou. </b></i><br>

Text po zalomení řádku patří do téhož odstavce.</p>

</body>

</html>

Vysvětlení jednotlivých tagů:

<h1>, </h1>

vymezení nadpisu první úrovně.

<h3>, </h2>

nadpis druhé úrovně (mezinadpis, nadpis kapitoly). Dá se použít až šest úrovní nadpisů (tedy až <h6>). Vykreslují se různě velké podle důležitosti.

<p>, </p>

vymezení odstavce. Možná vůbec nejpoužívanější tag. Po jeho konci prohlížeč automaticky zalomí řádek a udělá vertikální mezeru.

<b>, </b>

text mezi těmito tagy bude tučný.

<i>, </i>

kurzíva

<div> </div>

Značka pro vytvoření bloku

Značka <div> pokud chceme zároveň formátovat několik značek, např. abychom měli stejné orámování, můžeme všechny tyto značky umístit do <div>

<br>

zalomení řádky, takzvaný měkký enter. Text po tomto tagu bude vždy začínat na novém řádku, ale není to nový odstavec. Pozor, tento tag je nepárový, to znamená, že žádné </br> neexistuje!

V tomto příkladu se pokusím nastínit dvě nesouvisející věci, už poněkud těžší

<html>

<head>

<title>Třetí příklad, barva pozadí a odkazy</title>

</head>

<body style="background-color: green; color: yellow;">

<h1>Pozadí a odkazy</h1>

<p>Obyčejný text.</p>

<p>Odkaz na <a href="http://www.seznam.cz">Seznam</a>. </p>

<p><a href="priklad2.htm">Odkaz na příklad 2.</a></p>

</body>

</html>

<a href="adresa">text odkazu </a>

text (nebo obrázek) mezi těmito dvěma tagy se zobrazí jako text odkazu ("a" jako angl. "anchor" = odkaz). Po kliknutí na něj se prohlížeč přepne na adresu, která je zadaná atributem HREF.

href

atribut tagu "a" se rovná cestě k odkazovanému souboru. Používá se zde buď relativní, nebo absolutní adresa.

absolutní adresa

používá se ve formě http://www.atakdále.cz. V příkladu je takto použita adresa Seznamu.

relativní cesta

pokud se chci odkázat na jiný svůj soubor, je zbytečné vypisovat tam to http:// a celou cestu. Nejlepší je, když je odkazovaný soubor ve stejném adresáři jako ten aktuální. Pak se na něj dá ukázat relativně. Stačí zapsat jenom jméno souboru a prohlížeč to pochopí. (V příkladu je takto odkázaný druhý soubor priklad2.htm.) Jestliže je ten cílový soubor v jiném blízkém adresáři, stačí napsat href="adresář/soubor.htm".

<body style="background-color: green; color: yellow;">

způsob, jak stanovit barvy celého těla dokumentu.

style

atribut tagu <body>, který určuje vzhled celého dokumentu. V tomto případě nastavuje barvu pozadí stránky (background-color) na zelenou a barvu textu (color) na žlutou.

URL

Adrese se také říká URL. Znamená to Unique Resource Locator, čili jednoznačné umístění zdroje. Používá se nejenom u odkazů, ale i při vkládání obrázků, CSS souborů, objektů, prostě různých souborů.

Například "http://www.seznam.cz" je URL Seznamu.

Složení URL

URL lze symbolicky zapsat takto:

protokol://server.doména.generická-doména/cesta/soubor

Příklady:

URL se vyplňuje do atributu href tagu a. Symbolicky zapsáno:

<a href="URL">Odkaz</a>