Heim >Web-Frontend >CSS-Tutorial >Wie kann ich die Farbe von unterstrichenem Text ändern?

Wie kann ich die Farbe von unterstrichenem Text ändern?

Mary-Kate Olsen
Mary-Kate OlsenOriginal
2024-11-03 19:46:021127Durchsuche

How Can I Change the Color of Underlined Text?

Ändern der Farbe von unterstrichenem Text

Es ist ein weit verbreiteter Wunsch, Text mit Unterstreichungen zu gestalten, aber was ist, wenn Sie die Farbe dieser Unterstreichung anpassen möchten? Standardmäßig hat die Unterstreichung dieselbe Farbe wie der Text, aber es gibt Möglichkeiten, dieses Verhalten zu ändern, um die visuelle Attraktivität zu verbessern.

Dazu unterstützen moderne Browser jetzt die Eigenschaft text-decoration-color und machen es so eine unkomplizierte Aufgabe. Geben Sie einfach den gewünschten Farbwert an, und die Unterstreichung nimmt diesen Farbton an.

Wenn Sie jedoch ältere Browser bedienen müssen, die text-decoration-color nicht unterstützen, gibt es eine alternative Lösung. Durch das Setzen eines Rahmens am unteren Rand des Textes können Sie den Eindruck einer Unterstreichung erwecken. Die Rahmenfarbe kann wie jeder andere Rahmen gesteuert werden und ermöglicht so eine individuelle Anpassung.

Hier ist ein Beispiel mit CSS:

<code class="css">a:link {
  color: red;
  text-decoration: none;
  border-bottom: 1px solid blue;
}

a:hover {
  border-bottom-color: green;
}</code>

Dieser Ansatz funktioniert zuverlässig in allen Browsern und ist eine großartige Möglichkeit zum Hinzufügen ein Hauch von Stil für unterstrichenen Text.

Das obige ist der detaillierte Inhalt vonWie kann ich die Farbe von unterstrichenem Text ändern?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn