Yleisimpiä HTML-koodeja

Sivuotsikko - <TITLE></TITLE>

Jokaisella sivulla pitäisi olla otsikko, joka tulee näkyviin selaimen otsikkoriville:
<TITLE>Yksinkertainen HTML sivu</TITLE>

Taustan ja ulkoasun määrittely rungossa - <BODY määreet>


<BODY TEXT="#000000" BGCOLOR="#FFFFFF" LINK="#0000EE" VLINK="#551A8B" ALINK="#FF0000" BACKGROUND="image.gif">

BODY-koodissa on muutama tarkennin:

Värikoodeista


Kommentit - <!--kommentti -->

Kommenteilla voidaan dokumentoida sivussa tehtyjä määrityksiä, ne eivät näy muuten kuin katsottaessa lähdekoodia:

<!-- Tässä käytetty absoluuttista osoitetta -->

Kappaleotsikot <H1></H1>

Dokumentissa voidaan käyttää myös kappaletason otsikoita, joista H1 on ylimmän tason otsikko esim. 1. Johdanto ja sitä seuraavat alempien tasojen otsikoita esim. 1.1. (H2) tai 1.1.1. (H3)

<H1>Ensimmäisen tason otsikko</H1>
<H2>Toisen tason otsikko</H2>
<H3>Kolmannen tason otsikko</H3>

Listat

Lajittelematon lista (Unsorted List)


Lajittelematon lista on sisennetty luettelo asioista
<UL>
   <LI>juusto
   <LI>leipä
   <LI>maito
   <LI>voi
</UL>

Selaimesi näyttää esimerkin listan näin:

Järjestetty lista (Ordered List)

Järjestetyssä listassa asiat esitetään tietyssä nimenomaisessa järjestyksessä. Listan kohdat numeroidaan.

<OL>
   <LI>listan 1. asia
   <LI>listan 2. asia
</OL>

Kuvat - <IMG SRC=URL>

WWW-sivuille voi sijoittaa kuvia IMG-koodin avulla:
<IMG SRC=URL>
Esim. <IMG SRC="kuvat/verkko.gif" ALT="Verkon kuva">


Linkit - <A HREF="yleistä.html"> Yleistä </A>

Linkki toiseen HTML-tiedostoon

<A HREF="yleistä.html">Yleistä</A>

Muista kuitenkin, että toisten käyttäjien aineistojen käyttäminen ilman asianomaisen lupaa ei ole sallittua.
Tekstien sisäiset linkit
Saman dokumentin sisällä (myös dokumentista toisen dokumentin ankkuriin) voi tehdä linkkejä esim. sisällysluettelon sivun alkuun, merkitsemällä kohta, johon halutaan siirtyä suoraan seuraavasti:
<A name="Ryhmä 1">Ryhmä 1</A>:

Viittaus hyppykohtaan tapahtuu seuraavasti:

<A HREF="#Ryhmä 1"> Ryhmä 1</A>

Tiedostoviittaukset


Omissa töissä kannattaa käyttää ehdottomasti suhteellista viittausta omiin tiedostoihin (kuvat+sivut), koska tällöin dokumentit voidaan siirtää hakemistorakenteineen esim. CD ROM-levylle ja linkit toimivat ilman verkkoyhteyksiä.



Taulukot - <TABLE> </TABLE>

Taulukoilla voi tehdä esim. palstoituksen sivulle, sillä HTML 3.2 ei ota kantaa dokumenttien LayOut:iin. Taulukot on kätevintä tehdä WYSIWYG-editorilla. Taulukossa esiintyy seuraavia määrityksiä: solu (TD, table data), otsakesolu (TH, table header) ja rivinvaihto (TR). Esim. alla oleva määrittelee kaksi rivisen taulukon, jossa rivillä on kaksi solua:

<TABLE>
<TR>
<TD>
Ensimmäisen rivi 1.solun sisältö
<TD>
Ensimmäinen rivi 2. solun sisältö
<TR>
<TD>
Toinen rivi 1.solun sisältö
<TD>
Toinen rivi 2. solun sisältö
</TABLE>

Tämä määritys tuottaa alla olevan taulukon:
Ensimmäisen rivi 1.solun sisältö
Ensimmäinen rivi 2. solun sisältö
Toinen rivi 1.solun sisältö
Toinen rivi 2. solun sisältö

TABLE-koodissa on seuraavia tarkenteita: ALIGN, WIDTH=n tai WIDTH=n%, BORDER=n, CELLSPACING=n, CELLPADDING=n (n on pikseleinä)
TR-koodin tarkenteita: ALIGN, VALIGN
TD-koodin tarkenteita: NOWRAP, ALIGN ja VALIGN, WIDTH=n
TH-koodin tarkenteita: ROWSPAN=n, COLSPAN=n