HTML-opas aloittelijalle

Mikä on tägi?

- Tägi on HTML-komento jonka avulla ohjataan sitä miten tieto internet-sivulle tulostuu.

Yllä olevan osan HTML-koodi on seuraavanlainen:
 
<html>
<head>
   <title>HTML-opas</title>
</head>
<body>

<h1>
HTML-opas aloittelijalle</h1>

<h2>
Mik&auml; on t&auml;gi?</h2>
- T&auml;gi on HTML-komento jonka avulla ohjataan sit&auml; miten tieto
internet-sivulle tulostuu.
<br>
<hr WIDTH="100%">

</body>
</html>

 Jokainen HTML-dokumentti alkaa <html> -tägillä
<head> -tägi aloittaa otsikko osan.
<title> ja </title> -tägien väliin tulee sivun otsikko.
</head> -tägi lopettaa otsikko osan.
<body> -tägistä alkaa "varsinainen sivu".

<h1> -tägillä on ilmoitettu otsikko joka päättyy </h1>tägiin.
- otsikkoja on väliltä h1 - h7, h1 on suurikoisin ja h7 pienin.
 

Å,Ä ja Ö voidaan kirjoittaa normaalisti, mutta ns. umlauttien käyttö on suositeltavaa. Tällöin Ä = &auml; | Ö=&ouml; ja Å = &Aring;

<br> -tägillä vaihdetaan riviä ja se ei vaadi lopetustägiä.
<hr> -tägi tulostaa viivan jonka leveys tässä 100% ruudusta. Ei vaadi lopetustägiä.
</body> lopettaa "varsinaisen sivun".
</html> -tägi kertoo, että tähän sivun HTML-koodi päättyy = sivun loppu.
Tekstiä voidaan haluttaessa sisentää kuten tämä teksti on sisennetty, komennolla <blockquote>
Sisentäminen päättyy </blockquote> -tägiin.
Usein on paikallaan sisentää ainakin pykälän verran (=yksi <blockquote> -tägin) jotta teksti ei ole aivan kiinni vasemmassa laidassa.
Toki sisentää voi enemmänkin.

Tekstin lihavointi tapahtuun <b> -tägillä ja päättyy </b> -tägiin.

Fonttikokoa voi suurentaa <font size=+4> kokoon saakka ja pienentää kokoon <font size=-2> kokoon saakka.
Kokeile kirjoittaa seuraava ohjelma:
- ohjelman voit kirjoittaa esim. muistiolla. Tiedostotarkentimeksi .htm tai .html
- tallenna ohjelma haluamaasi kansioon, esim. www-kansioon.
- tallentamisen jälkeen avaa tiedosto internet -selaimella.

<HTML>
<HEAD> <TITLE>Tähän dokumentin otsikko</TITLE> </HEAD>
<BODY>
<font size=+1>Fontin kokoa voi muuttaa!</font size>
</BODY>
</HTML>

Muuta <font size=+1> -tägin lukua välillä +4 - -2, kuten huomaat <font size> -tägi päättyy </font size> tägiin, jonka jälkeen palataan käyttämää oletusfonttikokoa.

Kokeile lisätä <font size> -tägien lisäksi lihavointitägit.

<HTML>
<HEAD> <TITLE>Tähän dokumentin otsikko</TITLE> </HEAD>
<BODY>
<b><font size=+1>Fontin kokoa voi muuttaa ja fontin voi lihavoida!</font size></b>
</BODY>
</HTML>

Ylläolevasta voit huomata, että tägit päätetään "sisältä ulos", eli järjestyksen tulee olla esim. <b><font size> * </font size></b> se ei saa olla <b><font size> * </b></font size>. Sillä käyttääkö isoja vai pieniä kirjaimia ei ole merkitystä.

Fontti voidaan myös kursivoida komennolla <i>. Kursivointi päätty tietysti komentoon </i>.

Seuraava osa