05. Identyfikatory i klasy

Identyfikator

Identyfikator w CSS jest to atrybut elementu HTML, który określa ten element w sposób unikatowy. W jednym dokumencie HTML NIE MOGĄ wystąpić dwa elementy HTML o tym samym atrybucie „id”.

Identyfikatory stosuje się na przykład w celu określenia części dokumentu HTML, do którego odnosi się hiperłącze, np.:

<a href="#gora_strony">Na górę</a>

Najczęściej identyfikatorów używa się w celu „nazwania” ważniejszych części dokumentu HTML.

Nazwa identyfikatora musi posiadać przynajmniej jedną literę.

Nic nie stroi na przeszkodzie, aby każdy element HTML posiadał identyfikator.

Przykład określenia identyfikatora:

<div id="menu_lewe"></div>

Aby zmienić wygląd elementu div o identyfikatorze „menu_lewe” to w stylach należy użyć znaku # (płotek, sharp, kratka):

#menu_lewe{
   text-align:right;
   color:black;
}

Klasa

Elementom HTML można nadać klasę. Tą samą klasę może posiadać więcej niż jeden element HTML. Klasy w CSS stosuje się w celu określenia podobnego lub takiego samego wyglądu elementom HTML. Każdemu elementowi można przypisać wiele klas. Wtedy kolejne nazwy klas należy oddzielić spacją np.:

<p class="tekst-czerwony tekst-do-srodka">lorem ipsum</p>
<style>
    .tekst-czerwony{color:red}
    .tekst-do-srodka{text-align:justify}
</style>

Aby określić wygląd danej klasy należy w arkuszu CSS odnieść się do jej nazwy poprzedzając tą nazwę kropką „.”. W przykładzie akapit będzie posiadał tekst koloru czerwonego i ten tekst będzie wyjustowany.