ID

IDs stellen eindeutig identifizierbare Elemente dar (nicht nur in CSS). D.h. diese dürfen auf einer Seite nur einmal vorkommen. Dadurch ergibt sich, dass IDs direkt mit JavaScript durch getElementById() angesprochen oder auch als Ziel eines Hyperlinks genutzt werden können. Die Definition des Layouts einer ID erfolgt in CSS mit einem vorausgestellten.

 

 

Beispiel - Definition in css

#hinweisabsatz {
font-style: italic;
}

Beispiel in Kombination mit dem <p> Tag:

<p id=”hinweisabsatz”> Der erste Absatz, der kursiv formatiert ist. </p>

Unterschied zwischen einer Klasse und ID

Innerhalb eines HTML Dokuments dürfen IDs nur einmal verwendet werden. In der Praxis dagegen können die meisten Browser auch mit einer mehrfachen Verwendung einer ID innerhlab eines Dokumentes korrekt umgehen. Klassen dagegen können beliebig oft verwendet werden. IDs können als Ankerziele verwendet werden.

 

Ein weiterer Unterschied liegt in Wertigkeit, bei der IDs ein höheres Gewicht haben als Klassen. D.h. wird ein HTML Tag mit einer ID und einer Klasse gestylt, werden die in der ID festgelegten Definitionen Übernommen und die der Klasse, die nicht bereits in der ID vorhanden sind.