您好, 欢迎来到 !    登录 | 注册 | | 设为首页 | 收藏本站

是否有按类前缀的CSS选择器?

是否有按类前缀的CSS选择器?

这不是可行的与CSS2.1,但它有可能与CSS3属性字符串匹配选择(这 在IE7 +支持):

div[class^="status-"], div[class*=" status-"]

注意第二个属性选择器中的空格字符。这将选择divclass属性满足以下任一条件的元素:

[class^="status-"] —以“ status-”开头

[class*=" status-"]—包含直接在空格字符后出现的子字符串“status-”。根据HTML规范,类名称由空格分隔,因此是有效的空格字符。如果指定了多个类,这将在第一个类之后检查其他任何类,_并_增加了检查第一个类的好处,以防属性值被空格填充(某些class动态输出属性的应用程序可能会发生这种情况)。

如上所述,您需要组合两个属性选择器的原因是因为诸如这样的属性选择器[class*="status-"]将匹配以下元素,这可能是不希望的:

<div id='D' class='foo-class foo-status-bar bar-class'></div>

如果您可以确保 发生这种情况,那么为简单起见,您可以自由使用这样的选择器。但是,上面的组合更加健壮。

如果您可以控制HTML源代码生成标记的应用程序,则可以简单地将status-前缀设为自己的status类,而不是像Gumbo建议的那样。

CSS 2022/1/1 18:21:42 有410人围观

撰写回答


你尚未登录,登录后可以

和开发者交流问题的细节

关注并接收问题和回答的更新提醒

参与内容的编辑和改进,让解决方法与时俱进

请先登录

推荐问题


联系我
置顶