Heim > Web-Frontend > CSS-Tutorial > Wie setze ich eine CSS-Unterstreichung? Einführung in das Festlegen von Textunterstreichungen in CSS

Wie setze ich eine CSS-Unterstreichung? Einführung in das Festlegen von Textunterstreichungen in CSS

不言
Freigeben: 2018-10-27 11:16:58
Original
10033 Leute haben es durchsucht

Textschriften auf Webseiten haben standardmäßig keinen Unterstreichungsstil, aber manchmal sehen wir eine Unterstreichung unter Text, der kein Link auf einer Webseite ist. In diesem Artikel erfahren Sie, wie Sie Textunterstreichungen in CSS festlegen. Schauen wir uns als Nächstes den spezifischen Inhalt an.

Es gibt ein Textdekorationsattribut in CSS. Dieses Attribut wird zum Implementieren der Textunterstreichung verwendet.

Der Code für das Textdekorationsattribut Textunterstreichung implementieren ist wie folgt:

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style type="text/css">
        div{
            text-decoration: underline;
        }
    </style>
</head>
<body>
<div>php中文网文字加下划线</div>
</body>
</html>
Nach dem Login kopieren

Die Auswirkung der Textunterstreichung in CSS ist wie folgt:

Wie setze ich eine CSS-Unterstreichung? Einführung in das Festlegen von Textunterstreichungen in CSS

Ist die obige Methode nicht sehr einfach? Sie müssen dem Text nur einen Stil zuweisen, um eine Unterstreichung hinzuzufügen. Tatsächlich gibt es eine andere Möglichkeit, Text in CSS zu unterstreichen, nämlich die Verwendung des Rahmenattributs von CSS Text unterstreichen.

Das Rahmenattribut kann verwendet werden, um einen Textunterstreichungseffekt durch den unteren Rand von border-bottom zu erzielen. Schauen wir uns den Code genauer an, um eine Textunterstreichung zu erzielen.

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style type="text/css">
        span{
            border-bottom: 1px solid pink;
        }
        
    </style>
</head>
<body>
<span>中文网文字下划线</span>
</body>
</html>
Nach dem Login kopieren

Der Textunterstreichungseffekt ist wie folgt folgt:

Wie setze ich eine CSS-Unterstreichung? Einführung in das Festlegen von Textunterstreichungen in CSS

Wenn Sie die Textunterstreichung in eine gepunktete Linie ändern möchten, ändern Sie einfach die durchgezogene Linie im obigen Code in eine gestrichelte oder gepunktete Linie.

Der Grund, warum im obigen Code span anstelle von div verwendet wird, liegt schließlich daran, dass das div-Tag eine Zeile einnimmt und das span-Tag so viel Platz einnimmt wie der Inhalt breit ist, also relativ einfach, das Span-Tag zu verwenden.

Das obige ist der detaillierte Inhalt vonWie setze ich eine CSS-Unterstreichung? Einführung in das Festlegen von Textunterstreichungen in CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
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
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage