SVG/Attribut/class

Das class-Attribut ist eine mit Leerzeichen abgetrennte Liste, welche die Klassen definieren. Klassen erlauben CSS und JavaScript auf diese Elemente zuzugreifen. Dies wird durch Klassenselektoren oder Funktionen wie document.getElementsByClassName erreicht.

Erlaubte Werte

• alle Namen, in HTML4 keine Zahlen an erster Stelle
• inherit

Standardwert

anwendbar auf

alle Elemente

Präsentationsattribut

nein

mit CSS animierbar

nein

Beispiel

.normal {
  stroke: blue;
  stroke-width: 3;
  fill: none;
  }
.normal:hover,
.normal:focus {
  fill: yellow;
  }

Die Klasse normal erhält eine blaue Randlinie und keine Füllung. Bei :hover erhalten die Elemente mit dieser Klasse eine gelbe Füllung

Empfehlung: Klassennamen sollten einen semantischen Bezug auf die Funktion haben (Besser: "hinweis" als "roteBox")

Siehe auch

• SVG/Tutorials/Einstieg/SVG mit CSS stylen
• HTML/Attribute/class

Weblinks

• W3C: class attribute