text-decoration-color

Zusammenfassung

Mit der CSS-Eigenschaft text-decoration-color kann die Farbe für Unterstreichungen, Überstreichungen oder Durchstreichungen gesetzt werden, spezifiziert durch text-decoration-line. Das ist die bevorzugte Art und Weise, Textdekorationen eine Farbe zuzuweisen.

  • Initialwert currentColor
  • Anwendbar auf Alle Elemente
  • Vererbt Nein
  • Prozentwerte
  • Medium visuell
  • Berechneter Wert If the value ist translucent, the computed value will be the rgba() corresponding one. If it isn't, it will be the rgb() corresponding one. The transparent keyword maps to rgb(0,0,0).
  • Animierbar Ja, als Farbe
  • Kanonische Reihenfolge die einzige nicht missverständliche Reihenfolge definiert durch die formale Grammatik

Syntax

Formale Syntax: <color>
text-decoration-color: currentColor
text-decoration-color: red
text-decoration-color: #00ff00
text-decoration-color: rgba(255, 128, 128, 0.5)
text-decoration-color: transparent

text-decoration-color: inherit

Werte

<color>
Die Eigenschaft color akzeptiert verschiedene Schlüsselwörter und numerische Daten. Siehe <color>-Werte für genauere Details.

Beispiel

.beispiel { 
    text-decoration: underline;
    text-decoration-color: red;
}

Das obige Beispiel hat denselben Effekt wie der folgende Code, der auch noch einen Hover-Style hinzufügt.

<!DOCTYPE html>
<html>
<head>
<style>
.beispiel {
  font-size: 24px;
  text-decoration: underline;
  color: red;
}
.beispiel:hover {
  color: blue;
  text-decoration: line-through;
}
</style>
</head>
<body>
<span class="beispiel">
  <span style="color:black">schwarzer Text mit roter Linie und blauem Hovereffekt</span>
</span>
</body>
</html>

Spezifikationen

Spezifikation Status Anmerkung
CSS Text-decoration Level 3
Die Definition von 'text-decoration-color' in dieser Spezifikation.
Anwärter Empfehlung  

Browserkompabilität

Funktion Chrome Firefox (Gecko) Internet Explorer Opera Safari
Elementare Unterstützung ? 6.0 (6.0)-moz ? ? ?
Funktion Android Firefox mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Elementare Unterstützung ? 6.0 (6.0)-moz ? ? ?

Siehe auch

Schlagwörter des Dokuments und Mitwirkende

Mitwirkende an dieser Seite: FelixEdelmann, fscholz, ethertank, TheRojam
Zuletzt aktualisiert von: FelixEdelmann,