Wie füge ich URL-Text an Anker hinzu, ohne ihn in CSS zu unterstreichen?

Überarbeitung von „text-decoration“ und dem „:after“-Pseudoelement

Die Abfrage untersucht Herausforderungen beim Anpassen von Ankerelementen mithilfe des Pseudoklasse „:after“ in CSS. Konkret besteht das Ziel darin, die URL des Hyperlinks anzuhängen, ohne die Standardtextdekoration zu beeinträchtigen, um sicherzustellen, dass der URL-Text nicht unterstrichen bleibt.

Trotz Versuchen, die Deklaration „text-decoration: none“ zu verwenden, bleibt die Unterstreichung erhalten Browser wie Firefox und Chrome. Das Festlegen der Farbeigenschaft funktioniert jedoch effektiv. Der Fragesteller sucht nach einer Lösung, die auf Textinhalte mit variabler Breite anwendbar ist, und nicht auf Bilder mit fester Größe, wie in der ursprünglichen Anfrage besprochen.

Lösung:

Um dieses Problem zu beheben , kann die Eigenschaft „display: inline-block“ auf das Pseudoelement „:after“ angewendet werden. Dadurch wird sichergestellt, dass die „text-decoration“-Deklaration wirksam wird, was zu nicht unterstrichenem Text führt. Es wurde verifiziert, dass die Lösung in Chrome Version 25 und Firefox Version 19 funktioniert.

Das obige ist der detaillierte Inhalt vonWie füge ich URL-Text an Anker hinzu, ohne ihn in CSS zu unterstreichen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!