为没有文本的链接添加样式
显示没有文本的链接的链接URL。
- 使用
:empty
伪类选择没有文本的链接。 - 使用
:not
伪类排除带有文本的链接。 - 使用
content
属性和attr()
函数在::before
伪元素中显示链接URL。
<a href="https://30secondsofcode.org"></a>
a[href^="http"]:empty::before {
content: attr(href);
}
显示没有文本的链接的链接URL。
:empty
伪类选择没有文本的链接。:not
伪类排除带有文本的链接。content
属性和attr()
函数在::before
伪元素中显示链接URL。<a href="https://30secondsofcode.org"></a>
a[href^="http"]:empty::before {
content: attr(href);
}