HTML

...čiže programovanie stránok

1.   lekcia

V prvom rade by si mala vedieť niečo o HTML kódoch, ktorými tvoríme stránku.

Príklad

<font color=red>Učím sa programovať stránky </font>

Učím sa programovať stránky

Z tohto príkladu si môžeme odvodiť SYNTAX-stavbu kódu.

1.

Každý kód sa začína a končí hranatou zátvorkou < >

2.

Po hranatej zátvorke nasleduje „tag“, ktorý nám určuje, čo sa chystáme sformátovať,napr. <font…> nám určuje, že sa chystáme zmeniť text.

3.

Po tagu nasleduje „atribút“, ktorý určuje, čo ideme zmeniť na danom predmete, napr.

<font color=red>, nám určuje, že ideme meniť text, ideme meniť jeho farbu (nie napr. Veľkosť) a nasleduje hodnota, v tomto prípade red- teda červená.

! Atribútov môže byť viac, napr. Keď chceme dať text červený a veľký-

                            Správne

 <font color=red size=4>

                            Nesprávne

<font color=red><font size=4>

Ďalej sa musíme naučiť ďalšiu dôležitú vec- niektoré kódy sú párové

A niektoré zasa nepárové

Párové

sú kódy, ktoré sa začnú a musia sa ukončiť.

Príklad

<font color=red>sformátovaný text</font>

Kódy sa ukončujú tak, že dáme hranatú zátvorku, lomítko, tag a koniec zátvorky.

Keby sme kód neukončili, bolo by červené všetko písmo na celej stránke.

Nepárové

sú kódy, ktoré neukončujeme, pretože to nie je potrebné.

Príklad     

<br> je kód, ktorý určuje začiatok riadku. To znamená

Učím <br> sa programovať stránky

Učím

sa programovať stránky

Tento kód ukončenie nepotrebuje, pretože by to bolo nezmyselné.

2.   lekcia

Teraz by sme sa mali naučiť niekoľko jednoduchších základných kódov. Keďže HTML je vlastne počítačový jazyk, kódy sú ako slovíčka.

1.

tag FONT

tagom font meníme text.

 Zmena farby textu

<font color=(red, green, blue, navy, yellow, teal, silver,…)>nieco</font>

<font color=green>ahoj</font>

ahoj

 Zmena veľkosti textu

<font size=1-7>nieco</font>   (1 je najmensia velkost, 7 najvacsia)

                                       ALEBO

<font size=1px-...px>nieco</font>   (Velkost pisma mozeme vyjadrit v siedmych velkostiach 1-7,alebo v pixeloch.Ak vyjadrujeme velkost v pixeloch, davame za cislo znacku px)

<font size=6>ahoj</font>

ahoj

<font size=16px>ahoj</font>

ahoj

Zmena typu písma

Sú rôzne typy písma (napr. Comic Sans MS, SimSun,Times New Roman et cetera)

<font face=”Typ Pisma”>nieco</font>

<font face=”Comic Sans MS”>ahoj</font>

ahoj

!

Pri udavani hodnot (napr. „red“, „70px“, „Verdana“) nemusime davat vzdy uvodzovky.Uvodzovky sa davaju len vtedy, ked su v nazve hodnoty medzery, napr. „Comic Sans MS“, lebo pocitac by si mohol spliest SANS a MS s atributmi, a cely prikaz by bol nefunkcny.Nikdy nerob ani tu chybu, ze dame len jedny uvodzovky

<font color=“red>

<font color=red“>

je to velka chyba!

Takže ak to všetko skĺbime, mohlo by vzniknúť niečo takéto:

<font color=violet size=48px face=Verdana>ahoj</font>

ahoj

2.

Písmo tučné (bold), podčiarknuté (underline), šikmé-kurzíva (italic) a prečiarknuté (strike)

Tieto 4 tagy sú veľmi jednoduché, snáď aj najjednoduchšie.

Tučné písmo

<b>Tučné písmo</b>

Podčiarknuté písmo

<u>Podčiarknuté písmo</u>

Kurzíva

<i>Kurzíva</i>

Prečiarknuté písmo

<strike>Prečiarknuté písmo </strike>

3.

tag „marquee“

„marquee“ určuje, že sa objekt, ktorý je „obostretý“ týmto kódom, bude hýbať.Môže to byť aj text, aj obrázok, aj tabuľka, proste všeličo.

<marquee>ahoj</marquee>

text sa bude hybat sprava dolava

viac si pozri na http://www.fun-marina.wz.cz/html.html a tam si pozri pohyblive pismo, lebo vo Worde sa pohyb zobrazit nedaL

4.

tag „a“

„a“ je tag ktorý vyjadruje prenášanie rôzneho druhu, ktory určuju atributy. Z tejto vety si sa pravdepodobne nič nedozvedela a tak sa na to ideme pozrieť bližšieJ

Atribúty tagu „a“

 Atribút „href“

Atrinút href vyjadruje prenesenie do iného súboru, prípadne do emailu Je používaný napr. s tagom A, LINK a podobne..

<a href=”http://www.fun-marina.wz.cz”>Klikni</a>

Keby sme niečo takéto spravili na internete, ukázalo by sa Klikni, ale keby si tam na to klikla, prenesie ťa to na moju stránku. Dúfam že sa to z môjho chabého vysvetľovania dá pochopiťJ

Ak chceš urobiť takýto odkaz niekomu na email, stačí urobiť toto:

<a href=”mailto:niekto@nieco.xy”>email</a>

Keby si toto spravila na webe, ukáže sa ti email, ale kebyže na to klikneš, ukáže sa ti Bat s adresátom niekto@nieco.xy

 Atribút „target“

Atribút target určuje, akým spôsobom sa ti daný cieľ objaví a pokiaľ je mi známe tak nikdy nemôže byť v kóde sám s nejakým atribútom. To znamená že nič také ako

<a target=_blank>niečo</a>

nemôže existovať. Vždy pri tom musí byť niečo iné, napr.

<a href=”http://www.fun-marina.wz.cz”  target=_self>niečo</a>

Totižto význam atribútu target je v tomto prípade to, že sa ti po kliknutí na potenciálnom niečo objaví stránka http://www.fun-marina.wz.cz v rovnakom rámci ako je odkaz. Keby si dala

<a href=http://www.fun-marina.wz.cz target=_blank>niečo</a>

znamenalo by to, že stránka http://www.fun-marina.wz.cz sa ti po kliknutí na niečo zobrazí v novom okne.

Toto nie je ani zďaleka všetko ale na začiatok to stačí. Sú to úplné základy, ktoré treba vedieť. Nemá veľký zmysel začať ťa rovno učiť programovať stránky, kým nemáš žiadne základyJ. Ku programovaniu sa dostaneme tak v 4. lekcii, skôr iste nie. Dúfam že si to prežil/aJ