CSS i klase : CSS IDs and Classes

Selektor identifikatora : ID Selector

Selektor identifikatora koristimo pri definiranju svojstava samo jednog elementa.

Selektor identifikatora se odnosi na HTML element kojemu je vrijednost id svojstva jednaka nazivu selektora.

Primjer dodjeljivanja svojstva identifikatora:

<div id="sidebar">
  <!-- Sve što želimo da se nalazi unutar ovog elementa -->
</div>elementa

Slijedeći css kod primjenjuje se na HTML element koji ima postavljeno svojstvo id="siderbar" (u gornjem primjeru na element <div>).

#sidebar {
  text-align: center;
  color: blue;
}

Oznaka id selektora počinje s znakom ljestve '#'.

Započinjem web dizajn!

Selektor klase : Class Selector

Za razliku od identifikatora svojstvo klase koristimo za definiranje svojstava više elementa unutar html dokumenta.

Pomoću selektora klase definiramo sve HTML elemente kojima je vrijednost svojstva class jednaka njegovom imenu.

Primjer html koda koji ima postavljeno svojstvo klase na "podvuceno"

<h1 class="podvuceno">
  Naslov je podvučen.
</h1>
<p class="podvuceno">
  I tekst je također podvučen.
</p>

Slijedeći css kod primjenjuje se na sve HTML elemente koji imaju postavljeno svojstvo class="podvuceno" (u gornjem primjeru na elemente <h1> i <p>)

.podvuceno {
  text-decoration: underline;
  color: green;
}

Oznaka selektora klase počinje s znakom točka '.' za razliku od oznake selektora identifikatora koji počinje s znakom ljestve '#.'