Heim > Artikel > Web-Frontend > So verdicken Sie die Zeile unter dem a-Tag in CSS
In CSS können Sie das Attribut „border-bottom“ und das Attribut „text-decoration“ verwenden, um die Linie unter dem a-Tag dicker zu machen. Die Syntax lautet „a{text-decoration:none;border-bottom: Linienstärke“. Wert einfarbig Farbwert;}".
Die Betriebsumgebung dieses Tutorials: Windows 10-System, CSS3- und HTML5-Version, Dell G3-Computer.
So verdicken Sie die Linie unter dem a-Tag in CSS
In CSS können Sie das Attribut „border-bottom“ und das Attribut „text-decoration“ verwenden, um die Linie unter dem a-Tag dicker zu machen,
text-decoration Attribut Um dem Text hinzugefügte Änderungen anzugeben, wird das Attribut „border-bottom“ verwendet, um den unteren Randstil des Elements festzulegen. Daher können wir zunächst die ursprüngliche Unterstreichung des a-Tags entfernen und den unteren Rand des a-Tag-Elements als verwenden die Linie unter dem a-Tag. Auf diese Weise müssen Sie nur den Dickenwert des Rahmens unter dem a-Tag festlegen.
Das Beispiel sieht wie folgt aus:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> a{ color:red; border-bottom:5px solid red; text-decoration:none; } </style> </head> <body> <a href="">这是一个a标签</a> </body> </html>
Ausgabeergebnis:
(Lernvideo-Sharing: CSS-Video-Tutorial)
Das obige ist der detaillierte Inhalt vonSo verdicken Sie die Zeile unter dem a-Tag in CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!