在css中使用带选择器的启动是否有效？

Question

在css中使用带有选择器的开头是否正确？

HTML

<div id="row_1">
..
</div>
<div id="row_2">
..
</div>

CSS

div[id^='row']  {
 ...
}

它似乎适用于最新的浏览器，但我不确定这是否允许或w3c推荐 我希望知道这是为了学习最佳实践。

Answer 1

这些属性选择器完全有效。它们是part of CSS Selectors Level 3 spec，自2011年以来一直是W3C推荐标准。

但是，这些选择器对性能不是很好（例如，使用div[id^='row']浏览器将对页面上的每个div元素执行属性检查，包括字符串比较操作。使用类应该是更普遍的方法，因为使用id作为样式钩子并不是最好的想法。