CSS: Unterschied ID - Klasse
Neben der Direktformatierung von HTML-Elementen (Bsp: "h1" oder "p") können Formate auch über Klassen (class) und ID's (id) genutzt werden. Der Unterschied zwischen "class" und "id":
- Eine Klasse kann auf einer Seite mehrfach genutzt werden.
- Eine ID darf nur einmal pro Seite vorkommen.
Ein Element kann über eine ID per JavaScript angesprochen werden (Bsp: getElementById()).
ID's können nicht wie Klassen kombiniert werden.
Ein kleines Beispiel:
Im style-Bereich werden eine ID (per "#") und zwei Klassen (per ".") definiert.
Die ID wird nur in der Überschrift benutzt, die Klassen mehrfach und kombiniert in Überschrift und Absatz.
<html>
<head>
<style type="text/css">
#ueberschrift {
font-weight:bold; }
.farbe {
color:green; }
.schriftstil {
font-family:Arial,sans-serif; }
</style>
</head>
<body>
<h1 class="farbe schriftstil" id="ueberschrift">Hallo</h1>
<p class="schriftstil">Text...</p>
...
Die ID wird nur in der Überschrift benutzt, die Klassen mehrfach und kombiniert in Überschrift und Absatz.