XHTML - lekce 1: Moje první www stránka
21. září 2006 7:31
výuka, semináře
Jak jsem slíbil, začnu zde zveřejňovat podklady pro výuku tvorby www
stránek. A tak začínám plnit svůj slib.
Pokud chcete začít tvořit vlastní www stránky, v tomto seriálu
– v této rubrice snad naleznete dostatek informací, které vám
s tím pomohou. Moji žáci ze ZŠ Vrchlického, Liberec budou mít navíc
tu výhodu, že zde uvedené návody budou moci snadno aplikovat ve škole na
svých žákovských účtech a pokud své výsledky práce uloží na
svůj osobní disky do složky html, rovnou se tyto stránky zobrazí
na osobních internetových
stránkách.
První www stránka
Dnes si ukážeme jak vytvořit první vlastní www stránku. Dnes ještě
opomeneme všechny nutné definice, ke kterým se vrátíme později.
Pokud chceme vytvořit (X)HTML stránku, mějme na paměti, že jde
o obyčejný textový soubor. Proto si nyní otevřte například
Poznámkový blok a můžeme začít tvořit.
WWW stránka se skládá z jednotlivých značek
(tagů), které označují, jak se která část www stránky má
zobrazit. Důležité je si uvědomit, že každý tag má svůj
začátek (název tagu v špičatých závorkách –
většítku a menšítku) a konec (hned po většítku je
uvedeno lomeno).
Základní struktura www stránky
<html>
<head>
<title>Titulek mé první www stránky</title>
</head>
<body>
</body>
</html>
Jak si můžete všimnout, stránka se skládá z několika základních
částí:
- stránka je celá zabalena do tagu , všechny
tagy musí být uvnitř této dvojice.
- stránka má svou hlavičku, která je umístěna v tagu
.
- obsahová část www stránky je umístěna v tagu
.
Jaký je rozdíl mezi částí head a body?
Do části
head zapisujeme informace, které nejsou
přímo zobrazeny uživateli. Jediná část, která se ve stránce zobrazí
uživateli, je titulek stránky. Ten je uveden v tagu
Titulek stránky. Tento titulek pak uživatel
vidí v titulkovém pruhu okna prohlížeče (nejčastěji modrý pruh
okna prohlížeče ve Windows).
Do části body pak zapisujeme samotný obsah www
stránky, kterou chceme uživateli zobrazit. Zde tedy budou tagy
s odstavci textu, obrázky, odkazy, seznamy,… Tato část se tedy
přímo zobrazuje v internetovém prohlížeči.
Odstavec textu a nadpisy
No a abychom dnes ještě do naší www stránky umístili alespoň nějaký
text, tak si řekneme, jak vložit odstavec textu a nadpis.
Odstavec textu musíme umístit do tagu
<p></p>, takže je to velice snadné.
No a pokud bychom chtěli na stránce mít také nadpis, můžeme použít
jeden z tagů pro nadpisy; od tagu
<h1></h1> (nadpis nejvyšší
úrovně) až po tag <h6></h6>
(nadpis nejnižší úrovně).
Takže naše první www stránka, která bude obsahovat dva odstavce textu a
dva nadpisy, bude vypadat následovně:
<html>
<head>
<title>Titulek mé první www stránky</title>
</head>
<body>
<h1>Moje první www stránka</h1>
<p>A takhle vypadá první odstavec textu, který jsem na svou stránku umístil.</p>
<h2>Nadpis úrovně 2</h2>
<p>
No a tady je další odstavec. Zde si můžete všimnout toho,
že v HTML jsou ignorovány mezery, vždy se akceptuje pouze
jedna mezera.
</p>
</body>
</html>
A co nakonec se stránkou udělat?
Stačí ji v poznámkovém bloku uložit s příponou
.htm nebo .html a pak už
si ji můžete prohlížet ve svém internetovém prohlížeči.
Co nás čeká příště?
V příští lekci se podíváme na další (X)HTML tagy.
autor: jerrysohn |