HTML pokračování
<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>.
<span style="color: red;">Červený text.</span></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
- <span>, </span>
- dvojice tagů vymezující nějak odlišný text.
- <span style="color: red">, </span>
- V tomto případě má obalený kus textu červenou barvu písma. Jde o první příklad tagu, který má tak zvaný atribut. Atributem je "style" a má hodnotu "color: red" (angl. barva: červená). Pomocí tohoto atributu style= se dá detailně nadefinovat vzhled textu, obaleného libovolným tagem. V praxi má většina tagů nějaký atribut, zatím jsem se tomu vyhýbal.
- <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:
odkaz | protokol | server | doména | gen. doména | cesta | soubor |
---|---|---|---|---|---|---|
http://www.seznam.cz | http: | www | seznam | cz | není | není |
file:///C:/dokumenty/soubor.htm | file: | není | není | není |
C:/dokumenty |
soubor.htm |
http://www.jakpsatweb.cz/odkazy_html.htm | http: | www | jakpsatweb | cz | není | odkazy_html.htm |
URL se vyplňuje do atributu href tagu a. Symbolicky zapsáno:
<a href="URL">Odkaz</a>