Home > Schule > HTML > Was ist das? > <class>

Das Attribut "class="

"class=" gehört zu den Universalattributen. Universalattribute sind Attribute, die in der Mehrzahl aller HTML-Elemente vorkommen dürfen. Mit Hilfe dieses Attributs können Sie die Eigenschaften von Elementen bestimmen.

Den Namen und die Eigenschaften einer Klasse deklarieren Sie im <style>-Abschnitt einer HTML-Datei im <head> oder in einer CSS-Datei.

Das folgende Beispiel definiert zwei Klassen:

<style type="text/css">
.r {color: #FF0000; font-family: Courier New,Courier; font-size: 15px}
.w {color: #ffffff; font-family: Courier New,Courier; font-size: 15px}
</style>

Die Deklaration einer Klasse beginnt mit einem Punkt.

Die Deklaration darf keine Sonder- und Leerzeichen enthalten.

"Sprechende" Namen erleichtern die Benutzung von Klassen.

Die Klassen "r" und "w" legen Farbe, Schriftart und Schriftgröße von Text fest, wobei "r" für rot und "w" für weiß steht. Achtung: Im <style>-Abschnitt bezieht sich das Wort "color" auf die Schrift- bzw. Textfarbe. Wenn Sie die Textfarbe nicht über ein Styleshhet oder den <style>-Abschnitt definieren, müssen Sie "text" verwenden!

Um Text in  einem Element (z. B. einem Absatz oder einer Zelle) die Attributeigenschaften von "r" oder "w" zuzuweisen, schließen Sie den entsprechenden Text in ein <span>-Tag mit der Angabe der entsprechenden Klasse ein:

<span class="w">Dieser Text ist weiß </span> <span class="r"> und dieser rot.</span>

Das Ergebnis sieht so aus:

Dieser Text ist weiß und dieser rot.

Die Vorteile der Verwendung des class-Attributs liegen auf der Hand: Sie können einfach komplexe Formatierungen zuweisen und dabei auch noch "sprechende" Namen für die Klassen verwenden.

Zurück zur Was ist das?-Seite