|
Kao
što smo već rekli, dobra strana jednostavnih selektora – primjena na
sve oznake istog tipa – ujedno može biti i njihov velik nedostatak.
Pretpostavimo da želite izraditi stranicu s prijevodima latinskih izreka
tako da u jednom
paragrafu navedete izreku, u sljedećem
prijevod, i tako naizmjence. Da bi posjetitelji lakše razlikovali
prijevod od izvornika, željeli biste da tekst u paragrafima s različitim
vrstama sadržaja bude različito formatiran.
Možemo definirati ovakav stil:
.izreka {
font-weight: bold;
font-size: 11px;
}
.prijevod {
font-style: italic;
font-size: 12px;
}
te uz primjenu sljedećeg kôda:
<p class="izreka">Navigare necesse est,
vivere non est necesse.</p>
<p class="prijevod">Ploviti je nužno,
živjeti nije nužno.</p>
dobiti ovakav rezultat:
Navigare necesse est, vivere non est necesse.
Ploviti je nužno, živjeti nije nužno.
-
 Primjećujete da se pri definiranju selektora piše .naziv, a pri primjeni selektora na paragraf samo naziv.
Drugi način definiranja je oznaka.naziv. Razlika je što se ovako definirani selektori mogu primijeniti samo na oznake istog tipa. Primjerice:
p.izreka {
font-weight: bold;
font-size: 11px;
}
p.prijevod {
font-style: italic;
font-size: 12px;
}
Ovako definirani selektori primjenjuju se jednako kao i prethodni – <p class="naziv"> – ali za razliku od prethodnih, koji se mogu primijeniti na različitim oznakama, ovakvi se mogu primijeniti
samo na paragrafe.
Na ovakav način definirali smo klasne selektore i identificirali pojedine paragrafe kao pripadnike jedne, odnosno druge klase.
| 