当前位置:  开发笔记 > 前端 > 正文

组合:not()和:first-child()选择器

如何解决《组合:not()和:first-child()选择器》经验,为你挑选了1个好方法。

我正在寻找一种结合两个css选择器的方法.就我而言,':not'和':first-of-type'.这是我的代码:

...
...
...
...

我想选择第一个不包含'mobileOnly'类的div.image.

我尝试了以下组合(以不同的顺序):

#holder .image:not(.mobileOnly):first-of-type {
  border: 5px solid #0a85d4;
}

#holder .image:not(.mobileOnly) :first-of-type {
  border: 5px solid #0a85d4;
}

这有可能吗?



1> enguerranws..:

这是一个棘手的问题:我不认为有一个简单的方法来实现:)

据我了解:你试图选择第一个.image元素,只要它不是一个.mobileOnly元素?

#holder .image:first-child {
  border: 5px solid #0a85d4;
}
#holder .image.mobileOnly:first-child {
  border: none;
}
#holder .image.mobileOnly:first-child + .image {
  border: 5px solid #0a85d4;
}

实例:http://codepen.io/enguerranws/pen/wMWzBr

让我们解释一下:你试图选择第一个类型为.image的子节点,它作为类.onlyMobile>这不起作用,因为在你需要的情况下,.image它不是它的第一个类型的子节点.

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