Yleistä CSS:n käytöstä
CSS eli tyylimäärittelyn taustaa ja käytön mahdollisuudet
CSS:n muoto ja rakenne
CSS on muotoa:
No Format |
---|
selektori { ominaisuus: arvo; } esim. p { color: blue; } |
...
No Format |
---|
h1 {font-family: arial, sans-serif; font-size: 12pt;} |
Tyylimäärittelyn liittäminen html-sivuun
Tyylimäärittely voidaan liittää HTML-dokumenttiin kolmella tavalla:
...
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)
Tyyliohjeiden soveltaminen
Tärkeimmät selektorit
Selektori on css:llä määriteltävä kohde. Selektoreiden avulla deklaraatiot yhdistetään html-dokumentissa sijaitseviin kohteisiin.
...
Kontekstiselektori, esim. sisalto ul li
CSS ja selainten tuki
Sivujen toimivuus on välttämätöntä tarkistaa etenkin IE 6 ja 7 -versioilla, joita valtaosa käyttäjistä käyttää.
Vanhat selaimet tukevat vain CSS 1.
...
Tekstin muotoilu CSS:n avulla
Tekstin ulkoasun muuntelu (W3 Schools)
...
- fontin asettaminen
- tekstin väri
- fonttikoko
- tekstin taustaväri
- merkkien välit
- sanojen välit
- rivinkorkeus
- tekstin koristelu
Linkkien muotoilu
Linkkien muotoilu: ns. pseudo-luokat
Muita ulkoasun muotoiluja CSS:ssä
Yleistä
Värin ja taustavärin ominaisuudet
...
Täydellinen lista CSS:n ominaisuuksista (CSS1, CSS2, CSS3)