1.1. Webová stránka

Webová stránka sa skladá z HTML súborov. Sú to súbory v špeciálnom formáte .html. Tento súbor obsahuje prostý text, teda text bez akéhokoľvek formátovania.

Jazyk HTML

HTML (HyperText Markup Language) je značkovací jazyk, ktorý umožňuje špecifikovať pre prehliadač kde sa nachádzajú aké prvky dokumentu. HTML nie je programovací jazyk, je jazykom popisným a umožňuje vytvárať obsah (štruktúru) webovej stránky. Stránky sa totižto neskladajú iba z textu, ale obsahujú tiež navigáciu, záhlavie a zápätie stránky, odkazy, obrázky, zoznamy a mnoho ďalšieho.

Prvky webovej stránky môžeme prirovnať ku kockám Lega. Sú to jednotlivé bloky, z ktorých budeme stavať štruktúru webu. Tieto kocky sa nazývajú elementy.

<element>

Element sa skladá z ostrých zátvoriek a obsahu medzi nimi. To pomáha prehliadaču pochopiť, že sa jedná o HTML tag.

Elementy sú vo väčšine prípadov párové, tj. majú otváraciu a ukončovaciu časť. Ukončovacia časť vždy obsahuje / pred názvom elementu.

  <element>Obsah elementu</element>

Vnorovanie elementov

Jednotlivé HTML prvky môžu byť vnorované do seba.

<element>
  Rodičovský element
  <element>
    Vnorený element - potomok
  </element>
</element>

Nepárové značky

Ide o špeciálnu skupinu pár značiek, ktoré nemajú svoj ukončovací tag, a teda nepoužívajú spätné lomítko. Do nepárových elementov nie je možné vnoriť iný element. Napríklad tag pre prechod na nový riadok:

<br>

Atribúty elementu

Každý element môže obsahovať rôzne atribúty, ktoré si v neskorších kapitolách popíšeme. Zápis elementov je nasledovný:

<element atribut="hodnota">Atribút u párového prvku</element> 
<element atribut="hodnota">Atribút u nepárového prvku

Jazyk CSS

CSS (Cascading Style Sheets) je jednoduchý mechanizmus, pomocou ktorého zapisujeme pravidlá, ktoré popisujú, ako sa elementy majú zobrazovať.

Syntax CSS využíva selektory na vyberanie prvkov stránky, ktorej chceme dať určitý vzhľad. Napríklad:

selektor {
  vlastnost: hodnota;
}

alebo konkrétne:

p {
  color: red;
}

Tento zápis nastaví farbu textu v elemente p (odstavec) na červenú.

Oddelenie obsahu a vzhľadu

Ako už bolo povedané, jazyk HTML používame na popis webového obsahu. Neobsahuje žiadne informácie o tom, ako by mali stránky vyzerať. Každý prehliadač má v sebe zabudovanú definíciu pre zobrazenie východzích prvkov, ako sú odstavce, nadpisy, zoznamy a podobne, ale také stránky nevyzerajú pekne. Pokiaľ chceme, aby naše stránky vyzerali pekne, musíme im nastaviť kaskádové štýly.

Zápis CSS je možný na troch miestach:

Priamo do HTML elementu pomocou atribútu style.
Tento spôsob sa nepoužíva, pretože sa kód stáva neprehľadným a zložitým na úpravy.
```
<div style="color:red;">Element bloku</div>
```
Do tela súboru medzi elementy style:
```
<style>
...
CSS kód
...
</style>
```
Do samostatného súboru s príponou .css a zápis týchto súborov do hlavičky HTML stránky.
```
<head>
<link href="styly.css" rel="stylesheet">
</head>
```
Čo to znamená si vysvetlíme v kapitole CSS kód.

1.1.Webová stránka