Heim > Web-Frontend > CSS-Tutorial > So entfernen Sie Unterstreichungen in CSS

So entfernen Sie Unterstreichungen in CSS

王林
Freigeben: 2023-01-03 09:28:49
Original
10964 Leute haben es durchsucht

So entfernen Sie Unterstreichungen in CSS: Sie können das text-decoration-Attribut verwenden, z. B. [text-decoration: none;]. Der Attributwert none bedeutet keine Textdekoration.

So entfernen Sie Unterstreichungen in CSS

Die Betriebsumgebung dieses Artikels: Windows 10-System, CSS 3, Thinkpad T480-Computer.

Sie können das Attribut text-decoration verwenden, um die Unterstreichung von Text abzubrechen, wodurch die dem Text hinzugefügten Dekorationen, Unterstreichungen, Überstreichungen, Durchstreichungen usw. festgelegt werden.

Grundlegende Syntax:

/*关键值*/
text-decoration: none;                     /*没有文本装饰*/
text-decoration: underline red;            /*红色下划线*/
text-decoration: underline wavy red;       /*红色波浪形下划线*/
/*全局值*/
text-decoration: inherit;
text-decoration: initial;
text-decoration: unset;
Nach dem Login kopieren

Attributwert:

  • keine Standardeinstellung. Text, der den Standard definiert.

  • underline Definiert eine Zeile unter dem Text.

  • overline Definiert eine Zeile im Text.

  • line-through Definiert eine Linie, die unter dem Text verläuft.

  • blink Definieren Sie blinkenden Text.

  • inherit gibt an, dass der Wert des text-decoration-Attributs vom übergeordneten Element geerbt werden soll.​

(Teilen von Lernvideos: CSS-Video-Tutorial)

Codebeispiele sind wie folgt:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<style>
h1.under {
    text-decoration: underline;
}
h1.over {
    text-decoration: overline;
}
p.line {
    text-decoration: line-through;
}
p.blink {
    text-decoration: blink;
}
a.none {
    text-decoration: none;
}
p.underover {
    text-decoration: underline overline;
}

</style>
</head>

<body>
<h1 class="under">下划线</h1>
<p class="line">删除线</p>
<p class="blink">闪烁效果,但浏览器不会显示</p>
<h1 class="over">下划线</h1>
<p>这是一个 <a class="none" href="#">链接</a>,默认情况下链接是有下划线的,这边我们移除它。</p>
<p class="underover">上划线与下划线</p>

</body>

</html>
Nach dem Login kopieren

Verwandte Empfehlungen: CSS-Tutorial

Das obige ist der detaillierte Inhalt vonSo entfernen Sie Unterstreichungen 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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage