Načrtovanje in razvoj spletnih aplikacij

Lastnosti CSS predlog

Slogovno predlogo izdelamo po pravilih oz. standardu za določanje slogovnih lastnosti. Poglejmo si za začetek določitev lastnosti za element p :

p {
   font-family: Helvetica, sans-serif;
   font-style: italic;
   color: green;
}

Slogovna predloga, ki je podana v primeru, se sklicuje na vse oznake p v HTML dokumentu in za njih nastavi zeleno pisavo, ki je ležeča in je tipa Helvetica. V primeru, da v sistemu ni te pisave, pa privzeta pisava tipa sans-serif.

Naslov

To je prvi odstavek.

To je drugi odstavek.

Sintaksa

Vsako pravilo se začne s slogovno spremenljivko oz. selektorjem (v zgornjem primeru p).

ime_slogovne spremenljivke {
   lastnost_1: vrednost_lastnosti_1 [, vrednost_lastnosti_1 ...];
   [lastnost_2: vrednost_lastnosti_2 [, vrednost_lastnosti_2 ...] ...]
}

Slogovna spremenljivka je običajno eden ali več elementov (oznak) HTML dokumenta. Nato sledi določitev lastnosti znotraj zavitih oklepajev. Lastnost določimo s parom:

lastnost: vrednost [, vrednost ...];

Najprej zapišemo lastnost (npr. color), nato dvopičje, za njim pa vrednost (npr. green). V primeru, da je napisanih več pravil, jih med seboj ločimo s podpičji.

Definiranje področja z div in span

Kot pomoč pri oblikovanju lahko uporabljamo tudi HTML oznaki span in div. Prva je namenjena oblikovanju bloka, druga pa oblikovanju odstavka. Če jima ne določimo slogovne oblike, nimata nobenega oblikovnega učinka.