在倒置选择器逻辑上使用:not()
是否有任何优点或缺点?可能是性能,安全性或浏览器支持,建议使用哪种方法?
或者:
.imageSlider img:not(:first-child) {
display: none;
}
或者:
.imageSlider img {
display: none;
}
.imageSlider img:first-child {
display: block;
}
答案 0 :(得分:2)
有时使用:not
可能会更好。
<p class="my-paragraph">
<div class="something"></div>
<div class="something-else"></div>
<div class="an-other-thing"></div>
<div class="an-other-thing"></div>
<div class="last-one"></div>
</p>
在这种情况下,如果你想要隐藏everything
除了div .an-other-thing
,它会更快写出来:
.my-paragraph div:not(.an-other-thing) {
display: none;
}
而不是:
.my-paragraph div {
display: none;
}
.my-paragraph div.an-other-thing {
display: block;
}
在大多数情况下,较长的CSS意味着执行它的时间较长
答案 1 :(得分:-2)
截至2017年1月,目前只有Safari浏览器支持:not selector,全球浏览器支持率仅为11%。我不会在生产代码中使用它。