Sie befinden sich hier: » Selectoren » Element Selectors » Class Selector

class-Selector :: .class

Mit dem class-Selector kann man gezielt Elemente auswählen, und so verschiedenen Elementen die gleichen Attribute zuweisen. Klassen werden im Stylesheet mit einem führenden Punkt notiert. Bei Notation von verschiedenen Angaben in einem Typ-Selektor und einem class-Selektor ist der class-Selektor höherwertiger als der Typ-Selektor, und überschreibt dessen Angaben.

<style type="txt/css">
  .red { color: red;}
  .red.italic { font-style: italic; }
</style>
<p class="red">Dieser Textblock ist rot</p>
<p class="red italic">Dieser Text hat beide Klassen, und ist daher rot und kursiv"</p>
<ul class="red">
  <li>Diese Liste ist</li>
  <li>auch rot</li>
</ul>

so sieht es aus

Dieser Textblock ist rot

Dieser Text hat beide Klassen, und ist daher rot und kursiv"

  • Diese Liste ist
  • auch rot

Browserunterstützung für den class-Selector

Microsoft Internet Explorer Opera Netscape Mozilla Firefox Safari Konqueror Google Chrome
5+ 5+ 4 6+ 1+ 0.8+ 1+ 3.5+ 2
.classname J J J J J J J J J
letzte Änderung: 08.04.2011