Ns. isot elementit (laatikon kaltaiset)
| tägi |
merkitys |
mistä tulee |
huom |
| h1 |
pääotsikko |
header 1 |
|
| h2 |
alaotsikko |
header 2 |
|
| h3 |
alaotsikon alaotsikko |
header 3 |
|
| p |
tekstikappale |
paragraph |
|
| ul |
lista, jossa on palloja |
unordered |
saa sisältää vain li-elementtejä |
| ol |
lista, jossa on numeroita |
ordered list |
saa sisältää vain li-elementtejä |
| li |
listan kohta |
list item |
saa sisältää mitä tahansa |
| div |
lohko ilman kummempaa merkitystä |
division |
saa sisältää mitä tahansa |
| img |
kuva |
image |
ei lopetustägiä! |
| iframe |
elementti, joka tulee muualta |
inline frame |
käyttäytyy kuin img |
Yhteistä näille kaikille (paitsi img ja iframe):
- leveys oletusarvoisesti 100%
- aiheuttaa rivinvaihdon ennen ja jälkeen
Yhteistä näille kaikille (myös img ja iframe):
- voi säätää marginaaleja eli tyhjää tilää ylä- ja alapuolella
|
Ns. pienet elementit (kuin sanat)
| tägi |
merkitys |
mistä tulee |
huom |
| a |
linkki |
anchor |
|
| b |
lihavoitua tekstiä |
bold |
oli kielletty 2000-2014 |
| strong |
voimakkaasti korostettua tekstiä |
|
käytännössä sama kuin b |
| i |
kursivoitua tekstiä |
italic |
oli kielletty 2000-2014 |
| em |
korostettua teksitä |
emphasis |
käytännössä sama kuin i |
| u |
alleviivattua tekstiä |
underline |
ei yleensä kannata käyttää, koska näyttää linkiltä |
| small |
vähemmän tärkeää tekstiä, sivuhuomautus |
|
|
| img |
kuva |
image |
ei lopetustägiä |
| br |
rivinvaihto |
break row |
ei lopetustägiä |
|
Yhteistä kaikille:
- tälläiset menevät aina vierekkäin jos mahtuvat
|
Taulukot
| tägi |
merkitys |
mistä tulee |
| table |
taulukko |
|
| caption |
taulukon nimi, kuvateksti |
|
| tr |
taulukon rivi |
table row |
| th |
taulukon otsikkosolu |
table header |
| td |
taulukon tavallinen solu |
table data |
| td colspan="3" |
solu, joka vie 3 vierekkäisen solun tilan |
column span |
Linkit
| linkin muoto |
minne johtaa |
linkki on... |
| a href=vihannekset/perunat.html" |
vihannekset-kansiossa olevaan tidostoon peruna.html |
suhteellinen |
| a href="peruna.html" |
samassa kansiossa olevaan tiedostoon peruna.html |
suhteellinen |
| a href"../vihannekset/peruna.html" |
ylemmässä kansiossa "vihannekset" olevaan tiedostoon peruna.html |
suhteellinen |
| a href="http://joku.osoite.example" |
kyseiseen osoitteeseen world wide websissä |
absoluuttinen |
Div-elementin kaltaiset
| tägi |
merkitys |
mistä tulee |
huom |
| header |
sivun yläosa |
|
voi sisältää logon, sivun pääotsikon ja linkkejä (nav) |
| nav |
linkit sivuston pääsivulle |
navigation |
voi olla headerin sisäpuolella tai ulkopuolella |
| main |
sivun varsinainen sisältö |
|
vaatii ylimääräistä css-säätöä, jotta toimii myös internet Explorer-selaimessa |
| footer |
sivun loppu |
|
täällä on yleensä yhteystietoja tai tekijän nimi |