Kaskadne slogovne predloge CSS (angl. Cascading Style Sheets) določajo, kako naj brskalnik prikaže elemente dokumenta HTML. CSS ne določa pomena in strukture vsebine, temveč njen videz, razmike, postavitev, barve, pisavo in druge oblikovne lastnosti.
S pomočjo CSS lahko isto vsebino prikažemo na različne načine. To je posebej pomembno pri večstranskih spletiščih, saj lahko z eno slogovno datoteko nadzorujemo videz velikega števila strani.
Pomni: HTML določa strukturo in pomen vsebine, CSS pa določa njen videz. To ločevanje omogoča preglednejšo kodo in lažje vzdrževanje spletišča.
Osnovna pravila
Osnovno slogovno pravilo v CSS je sestavljeno iz dveh delov:
- selektor pove, na katere elemente se pravilo nanaša,
- blok deklaracij vsebuje eno ali več lastnosti in njihovih vrednosti.
Primer CSS kode
CSS pravilo lahko vsebuje več deklaracij. Vsaka deklaracija je sestavljena iz lastnosti in vrednosti, med njima pa stoji dvopičje.
Primerjava med HTML in CSS
HTML in CSS pri izdelavi spletne strani opravljata različni nalogi.
| HTML | CSS |
|---|---|
|
|
Pozor: CSS ni namenjen določanju logične zgradbe dokumenta. Če želimo določiti pomen vsebine, to naredimo z ustreznimi HTML-oznakami, ne pa s slogom.
Priporočila
- Za strukturo dokumenta uporabljaj HTML, za videz pa CSS.
- Pri več straneh raje uporabi zunanjo slogovno datoteko.
- Slogovna pravila piši pregledno, z jasnimi zamiki in smiselnimi selektorji.
- Lastnosti združuj po smislu, da je koda lažje berljiva in vzdrževana.
Pogoste napake
- Mešanje vsebinske strukture in oblikovanja.
- Uporaba nejasnih ali preveč splošnih selektorjev.
- Preveliko ponavljanje enakih slogov na več mestih.
- Nepravilno zapisane deklaracije, na primer manjkajoče dvopičje ali podpičje.
Napačno zapisano slogovno pravilo brskalnik prezre. Zato je pri pisanju CSS pomembna natančna sintaksa: pravilen selektor, zaviti oklepaji ter pravilno zapisane lastnosti in vrednosti.