简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Wie kann sichergestellt werden, dass eine dicke Unterstreichung bei Zeilenumbrüchen funktioniert?
P粉366946380
P粉366946380 2023-09-05 13:21:47
0
1
409

Ich verwende den folgenden Code, um meinen Hyperlinks eine dickere/stilisiertere Unterstreichungsdekoration hinzuzufügen. 

a { text-decoration: none;} a:hover { color: #c0632e } a::after { content: ""; position: absolute; unten: 0; links: 0; Hintergrundfarbe: #2EB0C0; Deckkraft: 0,15; Z-Index: -1; a:hover::after { Hintergrundfarbe: #c0632e }

Es funktioniert jedoch nur, wenn ich es in eine Klasse konvertiere und es jedem Link als hinzufüge. Wenn ich versuche, es global zu implementieren, funktioniert es nicht, wenn in der Mitte des Hyperlinks ein Zeilenumbruch steht. Es funktioniert gut, wenn keine Zeilenumbrüche vorhanden sind, aber nicht, wenn Zeilenumbrüche vorhanden sind.

Gibt es eine Möglichkeit, dies zu beheben, sodass es global verwendet werden kann, ohne dass definiert werden muss?

P粉366946380
P粉366946380

Antworte allen (1)
P粉356128676
P粉3561286762023-09-06 09:33:41 1 Etage

最近我也遇到了同样的问题。我建议你使用border bottom而不是::after。 试试这个：

a { border-bottom: 1rem solid; }

你也可以使用px来指定大小，而不是rem。如果边框颜色没有显示出来，不要忘记指定边框颜色

border-color: black;
Wie+0
Antwort hinzufügen
    Beliebte Themen
    Mehr>
    Populäre Artikel
    Beliebte Tutorials
    Mehr>
    Verwandte Tutorials
    Beliebte Empfehlungen
    Aktuelle Kurse
    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage
    Über uns Haftungsausschluss Sitemap
    Chinesische PHP-Website：Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！