Slika 1. Selektor klase /CLASS SELECTOR/ class="

Korištenje selektora klase /CLASS SELECTOR/ kao interni css /INTERNAL CSS/.

Oznake:
ImeKlase - Ime selektora klase /CLASS SELECTOR/
Atribut - Ime atributa ispisan u CSS-u.
Vrijednost - Vrijednost atributa ispisan CSS način

Aktivnost / Naredba

Kod u HEAD fajla:
<style>
.... kod ....
</style>

Primjer korištenja

Ime fajla

Ispis na ekranu

Boja teksta /TEXT COLOR/ >>

Boja teksta crvena /RED/.

>>

<h1 class="crven">Ispisuje crven naslov</h1>

<p class="crven">Ispisuje crven naslov</p>

LUPUS IN FABULA.

Mi o vuku vuk na vrata.

Boja teksta dokumenta žuta /YELLOW/.

{ color:#FFFF00; }

<style>
.zuta
   {color: #FFFF00;
}
</style>

>>

<h1 class="zuta">Ispisuje crven naslov</h1>

<p class="zuta">Ispisuje crven naslov</p>

LUPUS IN FABULA.

Mi o vuku vuk na vrata.

Font - ime i veličina /FONT - NAME SIZE/ >>

Izgled fonta - /FONT NAME/

{font-family: "Comic Sans MS";}

<style>
.izgled
   {color: red;
}
</style>

>>

<style>
.izgled {
font-family: "Comic Sans MS";
}
</style>

>>

<h1 class="izgled">PER ASPERA AD ASTRA.</h1>

<p class="izgled">Trnovit je put do zvijezda</p>

PER ASPERA AD ASTRA.

Trnovit je put do zvijezda.

Veličina fonta - /FONT SIZE/

{font-size: 150%;}

<style>
.veci {
   font-size: 150%;
}
</style>

>>

<h1 class="veci">Istaket naslov</h1>

<p class="veci">Podebljan tekst </p>

LUPUS IN FABULA.

Mi o vuku vuk na vrata.

Stil fonta masno, koso /BOLD, ITALIC/ b, i >>

Masno /BOLD/ b

{ font-weight: bold; }

<style>
.debeo
   {font-weight: bold;
}
</style>

>>

<h1 class="debeo">Istaket naslov</h1>

<p class="debeo">Podebljan tekst </p>

LUPUS IN FABULA.

Mi o vuku vuk na vrata.

Koso - kurziv /ITALIC/ i

{ font-style: italic; }

<style>
.koso
   {font-style: italic;
}
</style>

>>

<h1 class="koso">Istaket naslov</h1>

<p class="koso">Podebljan tekst </p>

LUPUS IN FABULA.

Mi o vuku vuk na vrata.

Podvučeno - /UNDERLINE/

{ text-decoration: underline; }

<style>
.podvuci {
   text-decoration: underline;
}
</style>

>>

<h1 class="podvuci ">Istaket naslov</h1>

<p class="podvuci">Podebljan tekst </p>

LUPUS IN FABULA.

Mi o vuku vuk na vrata.