Zkoušeli jste někdy tvořit webové stránky? Není to až tak náročné. Chce to trochu cviku a píle, ale není to nic, co by se kdokoli nedokázal naučit.
Všechna videa na YouTube kanále Zgrade
Za svůj život jsem vytvořil přes 1.500 video tutoriálů a návodů. Lidé se mě ptali, jestli nechci udělat návody na to, jak se naučit tvořit webové stránky. Tak jsem si řekl, proč ne.
Webové stránky se tvoří pomocí dvou jazyků:
- html jazyk (tzv. značkovací jazyk),
- css jazyk (tzv. kaskádové styly).
Pokud jste se s tvorbou webovek ještě nikdy nesetkali, tak vám tyto pojmy přijdou asi zvláštní. Není to ale nic složitého. Prvním jazykem, který se musíte naučit, je HTML jazyk. Jedná o značkovací jazyk. Představte si následující situaci. Budete chtít, aby prohlížeč zobrazil následující větu “10 nejvíce sledovaných videí na YouTube”. Jak to dopadne? Asi takto.
Prohlížeč větu sice zobrazí, ale vůbec netuší, co je to za větu. Je to odstavec, nadpis nebo jiný text? Proto používáme tzv. značky v HTML jazyce, abychom dali prohlížeči jasně najevo, co za text má zobrazit. To můžete udělat následovně.
Značky h1 říkají, že se jedná o tzv. heading první úrovně = nadpis první úrovně. Prohlížeč (v našem případě Google Chrome) text vezme a zobrazí ho větším písmem a tučně. Proč? Protože s ním nakládá jako s nadpisem. A takto postupně říkáte prohlížeči, co má zobrazit. Používáte k tomu HTML značky. Na obrázku výše vidíme tzv. párové značky. To znamená, že určují začátek <h1> a konec </h1>. Všimněte si, že otevírací a uzavírací značky se od sebe ničím neliší. Jen tím, že uzavírací značka má u sebe lomítko.
A takto bychom v HTML prohlížeči řekli, že daný text je odstavec. Odstavec se anglicky řekne paragraph, takže značkou bude písmo “p”. Na obrázku vidíte, že se text zobrazil normálně – není tučný, ani větší. Je to jen obyčejný text v odstavci. Tedy tak s ním prohlížeč nakládá.
No jo, ale co ten druhý jazyk? CSS jazyk. To jsou tzv. styly. Asi jste si všimli, že HTML jazyk nevypadá nic moc. Bylo by fajn, kdybychom přidali barvy, stíny, zarovnání apod. A to můžeme pomocí CSS jazyka. Jeho zápis je jednoduchý.
Nejdříve napíšete tzv. selektor – v tomto případě h1. Tím říkáte, že z HTML jazyka se budete zabývat značkou h1. Poté napíšete složené závorky (pravý Alt + B) a dovnitř zadáte, co se má s elementem HTML stát. My jsme zadali, že se má obarvit červeně (color = barva, red = červená). Nesmíme zapomenout na konci střední, který slouží pro ukončení pokynu. A je to. Vidíme, že nadpis h1 se skutečně červeně obarvil. Snadné, že?
Pojďme si u odstavce obarvit pozadí na barvu aqua (takže něco jako vodová barva). Zápis je naprosto stejný. Výsledek také vidíme.
Není to tak hrozné, že? Podstatu HTML a CSS tedy známe. Jen ještě doplním, že učit se HTML a CSS jazyk je to samé, jako učit se jakýkoli cizí jazyk. Prostě ho musíte používat. V tomto případě psát, psát a psát. No jo, ale kam se HTML a CSS píše? To si povíme v následujícím videu a článku. Nyní nám šlo jen o pochopení podstaty.
Nejnovější komentáře