Heim > Artikel > Web-Frontend > So setzen Sie Durchstreichen in CSS
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!