html类选择器前缀,是否有类前缀的CSS选择器？

最新推荐文章于 2023-12-12 09:35:39 发布

翁达

最新推荐文章于 2023-12-12 09:35:39 发布

阅读量841

点赞数

文章标签： html类选择器前缀

"本文讲解了如何使用CSS3的属性选择器在IE7及以上版本中，通过[class^="status-"]和[class*=" status-"]来精确匹配含有以'status-'开头或紧跟'状态-'的类名的div元素。特别关注了空格在类名中的作用和避免不必要的匹配。"

摘要由CSDN通过智能技术生成

慕田峪7331174

它不适用于CSS2.1，但它可以使用CSS3属性子串匹配选择器(在IE7 + 中受支持)：div[class^="status-"], div[class*=" status-"]注意第二个属性选择器中的空格字符。这将获取div其class属性满足以下任一条件的元素：[class^="status-"] - 以“状态 - ”开头[class*=" status-"] - 包含直接在空格字符后面出现的子字符串“status-”。类名按HTML规范用空格分隔，因此是重要的空格字符。如果指定了多个类，则在第一个类之后检查任何其他类，并在属性值被空间填充的情况下添加检查第一个类的奖励(对于某些class动态输出属性的应用程序可能会发生这种情况)。当然，这也能在jQuery的，这表现在这里。您需要如上所述组合两个属性选择器的原因是因为属性选择器[class*="status-"]将匹配以下元素，这可能是不合需要的：