CSS (Cascading Style Sheets) omogoča, da izgled in vsebino spletne strani obravnavamo ločeno.
CSS je zgrajen iz blokov, ki opisujejo slog. Slog je skupek lastnosti, ki opredeljujejo, kako se element besedila, za katerega slog velja, prikaže. Definicija sloga ima naslednjo zgradbo:
ul li, # element (li) neoštevilčenega seznama (ul) ol.razred li, # element (li) oštevilčenega seznama (ol) danega razreda p # odstavek { background: yellow; # rumeno ozadje font-weight: bold; # krepka pisava }
Najprej so našteti vsi elementi HTML dokumenta, za katere dani slog velja. V zgornjem primeru smo povedali, da se slog takole uporablja:
<ul> <li>Tu slog velja.</li> <li>Tu tudi.</li> </ul> <ol> <li>Tu slog ne velja.</li> </ol> <ol class="razred"> <li>Tu spet velja.</li> </ol> <p>Tudi tu je slog v uporabi.</p>
Ime | Opis | Primer |
---|---|---|
font-weight | Kako krepka je pisava (bold, ...) | font-weight=bold |
font-family | Določi tip pisave (Ariel, ...) | font-family: verdana,sans-serif; |
border-width | Določi širino obrobe tabele | border-width: 0.02cm |
margin-left | Levi odmik od roba lista | margin-left: 3% |
padding | Določi prostor od konca besede v celici do roba celice | padding: 0.1cm |
border-style | Neprekinjene črte v tabeli | border-style: solid |
Če želimo slog opredeliti v isti datoteki kot sam HTML dokument, postopamo takole:
<html> <head> ... <style><-- ... --><style> </head> ... </html>
Če je slog opredeljen v ločeni datoteki, ga v HTML vključimo takole:
<html> <head> ... <link rel="stylesheet" type="text/css" href="Stili.css" /> </head> ... </html>