Heim > Artikel > Web-Frontend > So setzen Sie Durchstreichen in CSS
So setzen Sie Durchstreichen in CSS
- 醉折花枝作酒筹Original
- 2021-04-20 10:33:2112912Durchsuche
In CSS können Sie das Attribut text-decoration verwenden, um das Durchstreichen festzulegen. Die Syntax lautet „text-decoration:line-through“. Das text-decoration-Attribut legt die Textdekoration des Elements fest. Wenn der Wert durchgestrichen ist, definiert es eine Linie, die unter dem Text verläuft.
Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.
Erstellen Sie eine neue test.html-Seite. Erstellen Sie im Hauptteil der test.html-Seite ein neues Div, um den Elementnamen zu speichern. Erstellen Sie einen neuen Bereich innerhalb des div-Tags, um den Artikelpreis zu speichern. Erstellen Sie ein neues Style-Tag im Textbereich der test.html-Seite und setzen Sie den Preis im Span-Tag im Style-Tag auf Rot.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.price{
color:red;
}
</style>
</head>
<body>
<div>键盘:
<span class="price">200元</span>
</div>
</body>
</html>Öffnen Sie test.html im Browser und sehen Sie sich den aktuellen Effekt an
Zurück zum Editor, im Style-Tag von test das text-decoration: line-through-Attribut für span festlegen
<style>
.price{
color:red;
text-decoration: line-through;
}
</style>Öffnen Sie test.html erneut, Sie werden feststellen, dass der Preis durchgestrichen wurde.
Empfohlenes Lernen: CSS-Video-Tutorial
Das obige ist der detaillierte Inhalt vonSo setzen Sie Durchstreichen in CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!