在 CSS 中,选择器是用来指定哪些元素将被样式化。
除了常规的选择器(如元素选择器、类选择器、ID 选择器等),CSS3 还引入了许多新增的选择器,其中包括 CSS5 选择器。
/* 一些CSS5选择器的示例 */ /* :not() 伪类选择器 */ p:not(.class) { color: red; } /* :checked 伪类选择器 */ input[type="checkBox"]:checked ~ label { text-decoration: line-through; } /* ::before 伪元素选择器 */ p::before { content: "在这个段落之前插入这段文字"; } /* [attr^="value"] 属性选择器 */ a[href^="https://"] { color: blue; } /* [attr$="value"] 属性选择器 */ a[href$=".pdf"] { font-weight: bold; } /* [attr*="value"] 属性选择器 */ input[type="text"][name*="user"] { background-color: lightgrey; }
这些选择器可以让开发人员更准确、更高效地选取特定的元素和属性,并给它们应用特定的样式。
但是,过多的选择器和复杂的选择器链可能会导致性能下降和可维护性降低,因此建议谨慎使用 CSS5 选择器。