Rozlúsknite skratku HTML !

HTML je jazyk pre popis webovských stránok .


H Hyper Odkaz na externý element
    napríklad iný hypertext
T Text
M Markup Využívanie značiek ( tagov )
   pre formátovanie stránok
L Language Jazyk

Browser, prehliadač (t.j. program, ktorý jazyku HTML rozumie ) dokáže zobraziť to, čo mu "recept" napísaný v jazyku HTML hovorí.

Jazyk HTML je textového ( ASCII ) formátu, nie je nikdy prekladaný do binárnej, či inéj podoby. Tak, ako sa živelne vyvíja Internet, mení sa i jazyk HTML. V súčasnosti platí verzia 4.0 tohto jazyka, schválená koncom roka 1997.


Čo je tag ?
TAG ( kontajner, značka ) - vyhradené slovo v špicatých zátvorkách < >.

Všetko mimo špicatých zátvoriek tvorí vlasný obsah obrazovky!

 < PRIKAZ > OBSAH OBRAZOVKY < /PRIKAZ >

 
 TAGY párové Ak by existoval tag <CERVENY>, tak určite vytušíte, čo urobí nasledujúci príkaz:
<CERVENY>Tento text bude červený</CERVENY>A tento už nie
 
nepárové Napr. pre vloženie obrázku do stránky by mohol príkaz vyzerať takto:
        <OBRAZOK  ZDROJ="domcek.gif">.
V skutočnosti tento tag má tvar:
        <IMG SRC="domcek.gif">
 



Čo je odkaz ?

ODKAZ ( hyperlink, link ) - prvok na stránke, ktorý priamo vedie k inému prvku - vytvára medzi nimi väzbu. Hovoríme, že sa na odkazovaný prvok ukotví.
Odkazový prvok je graficky zvýraznený - text je modro podškrtnutý, obrázok je v modrom rámčeku. Myška sa na danom prvku zmení zo šípky na ruku.

 
Odkaz by mohol mať napr. takýto tvar:

<KOTVA ODKAZ="iny_hypertext.html" > Tu klikni < /KOTVA >

V skutočnosti odkazový tag má tvar:

<A HREF="iny_hypertext.html"> Tu klikni < /A >


Vlastne je to to isté. Prečo?  A - Anchor - znamená kotva
     HREF - Hyperlink Reference - znamená odkaz na iný hypertext



Štruktúra HTML súboru
V každom HTML súbore nesmú chýbať nasledujúce tagy:

<HTML> ........ začiatok textu vo formáte HTML
<HEAD> ........ začiatok hlavičky
<TITLE> Názov dokumentu </TITLE>
</HEAD> ........ koniec hlavičky
<BODY> ........ začiatok tela HTML súboru

................ VLASTNÝ OBSAH STRÁNKY ................
</BODY> ........ koniec tela HTML súboru
</HTML> ........ koniec formátu HTML


Ďalšie dôležité tagy
Medzi ďalšie základné dôležité tagy okrem vyššie uvedených "povinných" patria nasledújúce štyry skupiny tagov, ktorých použitie demonštrujú príklady. ( Zdrojový html kód je v sivej tabuľke, účinok kódu sa nachádza vedľa tabuľky. )

Nepárové tagy :
<HR> ........ vykreslí vodorovnú čiaru
<BR> ........ prejde na nový riadok
<P> ........ vyznačí začiatok odstavca
<IMG SRC="URL"> ........ vloží bitmapový obrázok

Príklad 1. :

Tento HTML kód sa zobrazí následovne :
<P>Nasledujúci obrázok<BR>

zobrazuje tretí stav uhlíka: <BR>

<HR>

<IMG SRC="fullerene.jpg">		    Nasledujúci obrázok
   zobrazuje tretí stav uhlíka:
   

   


Párové tagy pre úpravu písma :
<Hn> </Hn> ........ nastaví výšku písma - najväčšie pre n=1 a          najmenšie pre n=7
<B> </B> ........ ohraničuje tučné písmo
<I> </I> ........ ohraničuje šikmé písmo
<U> </U> ........ ohraničuje podškrtnuté písmo

Príklad 2. :

Tento HTML kód sa zobrazí následovne :
<H2><I>
Tento text je veľký a šikmý
</I></H2> <BR>

<H4><B>
Tento text je menší a tučný
</B></H4> <BR>

<H6><U>
Tento text je malý a podškrtnutý
</U></H6>

  Tento text je veľký a šikmý


    Tento text je menší a tučný


      Tento text je malý a podškrtnutý




Párové tagy pre tvorbu zoznamu :

<UL> </UL> ........ neusporiadaný zoznam tzv. guličkový zoznam
<OL> </OL> ........ číslovaný zoznam
<LI> </LI> ........ položka zoznamu

Príklad 3. :

Tento HTML kód sa zobrazí následovne :

<OL>
<LI>Január</LI>
<LI>Február</LI>
<UL>
<LI>Pondelok</LI>
<LI>Utorok</LI>
</UL>
<LI>Marec</LI>
  1. Január
  2. Február
    • Pondelok
    • Utorok
  3. Marec





Párové tagy pre tvorbu tabuliek :

<TABLE> </TABLE> ........ vymedzuje oblasť tabuľky
<TR> </TR> ........ vymedzuje oblasť jedného riadku tabuľky
<TD> </TD> ........ vymedzuje obsah jednej bunky tabuľky

Príklad 4. :

Tento HTML kód sa zobrazí následovne :

<TABLE>
<TR><TD> Ovocie </TD>
         <TD> Jablko </TD></TR>
<TR><TD> Zelenina </TD>
         <TD> Kaleráb </TD></TR>
</TABLE>
 Ovocie   Jablko
  Zelenina   Kaleráb




Je to jednoduché !

Na vytvorenie vlastnej WWW stránky vám stačí pár predošlých tagov jazyka HTML. Vaša stránka môže vyzerať napríklad takto:
Ako ju vytvoríte ?
Nasledujúci HTML kód stránky z našej ukážky si doplňte vlastnými údajmi:

<HTML>
<HEAD>
<TITLE>Ukážka WWW</TITLE>
</HEAD>
<BODY>
<CENTER> <H1> Vitajte na mojej WWW stránke ! </H1> </CENTER>
<HR>
<IMG SRC="moje_foto.jpg" >
<H2> <I> Moje meno : </I> <B> Janko Hraško </B> <BR>
          <I> Škola : </I> <B> Stredná rozprávková </B> <BR>
          <I> E-mail : </I> <B> hrach@chalupka.sk </B> <BR> </H2>
<HR>
<CENTER> <U> <H3> Moje záujmy: </H3> </U> </CENTER>
<UL> <LI> mám rád bryndzové halušky </LI>
          <LI> tiež hrachovú polievku </LI>
          <LI> zaujímam sa o bohaté princezné </LI>
</UL>
<HR>
<P> Ak máte podobné záujmy ako ja, ozvite sa!
<BR>Navštívte tiež www stránku mojich kamarátov
<A HREF="http://www.salas.sk">Maťka a Kubka</A>
</BODY>
</HTML>