在不使用类的情况下设置链接样式
当设置注入或生成的 HTML 内容的样式时,你可能无法访问要设置样式的元素的类或 ID。在处理链接元素时,这可能会变得特别令人讨厌。幸运的是,你可以使用带有适当属性选择器的 :not()
选择器来检查类的 absence
,并相应地设置链接样式。
<body>
<a href="">在不使用类的情况下设置链接样式</a>
<style>
a[href]:not([class]) {
color: #0077ff;
text-decoration: underline;
}
</style>
</body>
这个技巧非常巧妙地利用了 CSS 选择器的组合:
a[href]
属性选择器选择所有具有href
属性的<a>
元素。这实际上选择了所有的链接,因为href
属性是<a>
元素的必需属性。:not()
伪类选择器用于排除匹配特定选择器的元素。在这个例子中,它用于排除具有class
属性的元素。[class]
属性选择器选择具有 class 属性的元素,不管它的值是什么。