当前位置:  开发笔记 > 编程语言 > 正文

只有当存在2个类时,才能使用CSS定位元素吗?

如何解决《只有当存在2个类时,才能使用CSS定位元素吗?》经验,为你挑选了2个好方法。

您可能已经知道,在空格分隔的元素上可能有多个类.

并与CSS,你可以定位div有两种.content.main.当且仅当两个类都存在时,有没有办法定位它?

I want this div
I don't care about this one
I don't want this

我将使用哪个CSS选择器来获得第一个div(假设我不能使用.content:first-child或类似)?



1> Gumbo..:

是的,只是将它们连接起来:.content.main.请参阅CSS类选择器.

但请注意,版本6以下的Internet Explorer不支持多个类选择器,只是尊重最后一个类名.



2> Wesley Murch..:

只是为了它的缘故(我真的不建议你这样做),有另一种方式来做到这一点:

.content[class~="main"] {}

要么:

.main[class~="content"] {}

参考:http://www.w3.org/TR/CSS2/selector.html

E [foo~ ="warning"]匹配任何E元素,其"foo"属性值是空格分隔值列表,其中一个完全等于"warning"

演示:http://jsfiddle.net/eXrSg/

为什么这实际上有用(至少对于IE6):

由于IE6不支持多个类,我们不能使用.content.main,有一些javascript库如IE-7.js启用了属性选择器,但在涉及多个类时似乎仍然失败.我已经在IE6中使用javascript启用了属性选择器测试了这个变通方法,它很难看,但它确实有效.

我还没有找到一个脚本,使IE6支持多个类选择器,但发现许多启用属性选择器.如果有人知道一个有效的,请在评论中给我一个喊叫,这样我就可以摆脱这种解决方法.

推荐阅读
大大炮
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有