Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

  • Ulkoasu määritellään erilliseen tyylitiedostoon
  • Tiedosto liitetään HTML-dokumenttiin HEAD-lohkossa LINK-tunnisteella
  • Suositeltava tapa, koska sama tyylitiedosto voidaan helposti liittää mihin dokumenttiin tahansa
  • Tyylitiedoston linkittäminen:
    No Format
    <head>
    <link rel="stylesheet" type="text/css" href="mystyle.css"        />
    </head>
    

Määrittelyiden vaikutus html-sivuun:
Jos ulkoasun määrittely on tehty eri kahdella tai useammalla tavalla, ne vaikuttavat ulkoasuun tässä järjestyksessä:
1. Ensisijaisesti huomioidaan yksittäisen html-elementin tyyli (kohta 1)
2. Toiseksi HEAD-lohkossa määritetty tyyli (kohta 2)
3. Kolmanneksi ulkoisessa tyylitiedostossa määritelty tyyli (kohta 3)

...

2. Lisää tyylitiedostoon perustyylejä: body, p, a (+ pseudoluokat), eri otsikkotasot.

No Format
Esim.
body
{       background-color : #FFFFFF;
        font-family : Verdana, Arial, sans-serif;
        color : #000088;
        margin: 0px;       
}

3. Tallenna tyylitiedosto samaan kansioon kuin muutkin harjoitukset css-nimiseen kansioon nimellä tyyli1.css
4. Avaa viime kerralla tehty harjoitussivu, joka sisältää kuvia ja tekstiä. 

...