Heim  >  Artikel  >  Web-Frontend  >  Wie füge ich Durchstreichen in CSS hinzu? CSS-Textdekorationsattributsätze durchgestrichen (Codebeispiel)

Wie füge ich Durchstreichen in CSS hinzu? CSS-Textdekorationsattributsätze durchgestrichen (Codebeispiel)

青灯夜游
青灯夜游Original
2018-10-09 14:10:0622990Durchsuche

Wie füge ich Durchstreichen in CSS hinzu? Im vorherigen Artikel [Wie füge ich Text in HTML durchgestrichen hinzu? Zwei Methoden zum Durchstreichen (Beispiel) ] Wir haben zwei Methoden zum Hinzufügen von Durchstreichungen zu HTML-Tags vorgestellt. In diesem Kapitel erfahren Sie, wie Sie das CSS-Textdekorationsattribut verwenden, um Text durchzustreichen. Durchgestrichener Effekt, wie man den durchgestrichenen Stil mit CSS festlegt. Es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird Ihnen hilfreich sein.

Zuerst verstehen wir das CSS-Textdekorationsattribut. Hier ist eine kurze Einführung:

Das Textdekorationsattribut gibt die dem Text hinzugefügte Dekoration an.

Beschreibung:

Mit diesem Attribut können Sie bestimmte Effekte auf den Text festlegen, z. B. das Hinzufügen von Durchstreichungen. Wenn das Nachkommenelement keine eigenen Dekorationen hat, „erweitern“ sich die auf dem Vorfahrenelement festgelegten Dekorationen auf die Nachkommenelemente. Benutzeragenten müssen Blinken nicht unterstützen.

Also, wie man das CSS-Attribut „text-decoration“ verwendet, um den durchgestrichenen Effekt von Text hinzuzufügen , unten erklären wir die Implementierungsmethode von CSS-Durchgestrichen anhand eines einfachen Codebeispiels im Detail!

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>css添加文本文字的删除线</title>
		<style>
			p{
				text-decoration:line-through;
			}
		</style>
	</head>
	<body>
		<p>这里有一条删除线</p>
	</body>
</html>

Rendering:

Wie füge ich Durchstreichen in CSS hinzu? CSS-Textdekorationsattributsätze durchgestrichen (Codebeispiel)

Beschreibung:

Line-through-Attributwert: Definiert eine Linie, die unter dem Text verläuft.

Wie Sie dem Beispiel entnehmen können, fügt das Setzen von text-decoration:line-through; eine Durchstreichung zum Text im

hinzu. Und Sie können den durchgestrichenen Stil einfach über CSS-Einstellungen ändern, z. B. Farbe, zum Beispiel:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>css添加文本文字的删除线</title>
		<style>
			p{
				text-decoration:line-through;
				color: red;
			}
			span{
				color: black;
			}
		</style>
	</head>
	<body>
		<p><span>这里有一条删除线</span></p>
	</body>
</html>

Rendering:

Wie füge ich Durchstreichen in CSS hinzu? CSS-Textdekorationsattributsätze durchgestrichen (Codebeispiel)

Auf diese Weise können wir durch die Kombination von text-decoration: line-through; und den Stileffekt verschiedener durchgestrichener Textfarben erzielen es ist ganz einfach!

Zusammenfassung: Das Obige ist der gesamte Inhalt dieses Artikels, ich hoffe, dass er für das Studium aller hilfreich sein wird. Weitere verwandte Tutorials finden Sie unter CSS-Video-Tutorial !

Verwandte Empfehlungen: PHP-Video-Tutorial zum Gemeinwohltraining

Das obige ist der detaillierte Inhalt vonWie füge ich Durchstreichen in CSS hinzu? CSS-Textdekorationsattributsätze durchgestrichen (Codebeispiel). 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