Yleisimmät HTML-elementit

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 list 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ä divison saa sisältää mitä tahansa
img kuva image ei lopetustägiä!
iframe elementti, jonka sisältö 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 sisältää marginaaleja eli tyhjää tilaa 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 tekstiä emphasis käytännössä sama kuin i
u alleviivattua tekstiä underline ei yleensä kannata, koska näyttää linkiltä

div-elementin kaltaiset

tägi merkitys mistä tulee huom.
header sivun yläosa voi sisältää logon, sivun pääotsikon ja likkejä (nav)
nav linkit sivuston pääsivuille navigation voi olla headerin sisä tai ulkopuolella
main sivun virallinen sisältö vaatii ylimääräistä css-säätöä, jotta toimii Explorer selaimessa
footer sivun loppu täällä on yleensä yhteistietoja ja tekijän nimi
Linkit
linkin muoto minne johtaa linkki on...
a href ="vihannekset/peruna.html" vihannekset-kansiossa olevaan tiedostoon peruna.html suhteellinen
"peruna.html" samassa kansiossa olevaan tiedostoon suhteellinen
a href ="../vihannekset/peruna.html" ylemmässä kansiossa "vihannekset" olevaan tiedostoon peruna.html suhteellinen
a href="https://medipjt.fi/etunimi.sukunimi/vihannekset/ kyseiseen osoitteeseen world wide webissä absoluuttinen
Div-elementin kaltaiset
tägi merkitys mistä tulee huomioitavaa
header sivun yläosa voi sisältää logon, sivun pääotsikon ja linkkejä (nav)
nav linkit sivuston pääsivuille 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