A stíluslapokon stílusmegadásokkal (stílusdefiníciókkal) formázhatjuk meg a kívánt oldalelemeket: a böngésző az itt megadott definíciók alapján fogja megjeleníteni az oldalt. A böngészők nem teljesen kompatibilisek egymással a stíluslapok használatát illetően, ezért teszteljük oldalainkat a több böngészőben, ha lehetséges, illetve a 4-esnél kisebb verziójú böngészőkben is.
A stílusmegadások helye: lehet az oldalhoz hozzárendelt önálló stíluslapfájl, amely csak css kódot tartalmaz, globális stílusmegadás, a
1 | <style> .. </style> |
tag segítségével, illetve az egyes tag-ek szintjén, beágyazott formában. Erről bővebben a Stíluslapok elhelyezése c. részben lesz szó.
Egy stílusmegadás általános formája:
CSS-kiválasztó {tulajdonságnév1:érték1, tulajdonságnév2:érték2 [stb.]}
A stílusmegadások két részből állnak: a CSS-kiválasztóból (css selector) és a stílusdefiníciós részből (description), pl. a
1 | H1 {color:blue} |
kód a Heading1 címsorstílust mindig (esetleges felüldefiniálásig) kék színnel fogja megjeleníteni. A CSS-kiválasztó a stílusosztály vagy a módosítandó tag nevét jelenti (példánkban ez utóbbi a H1), amelyet egy pont és az alosztály nevének megadásával lehet szűkíteni. A kapcsos zárójelbe írandó stílusdefiníciós részben szerepelnek a stílus tulajdonságai {tulajdonság név: érték} formában (a fenti példában a {color:blue} a stílusdefíníció). A stílusmegadásoknál lehetőség van egyszerre több stílusdefiníció (vagyis tulajdonság) összevonására, felsorolására, melyeket egymást követően írva, pontosvesszővel kell elválasztani.
Lehetőség van a kiválasztók összevonására is, pl.
1 | p em {background:blue} |
Ez azt jelenti, hogy az összes olyan kiemelt szöveg, amely bekezdésben van, kék hátteret kap, de pl. a címsorokban szereplő kiemelt szövegekre ez a formázás nincs hatással.
A szerző honlapja: http://fodorsi.ini.hu