组合:nth-​​of-type()和:not

时间:2012-08-30 21:16:54

标签: css css3 css-selectors

我有一个奇怪的例子,试图结合两个伪类::not:nth-of-type()来获取非隐藏项目的彩虹条纹

拥有:not([selector]):nth-of-type([rule])后,我假设css会在应用:not规则之前先过滤:nth-of-type个项目,但按任意顺序排列会给我相同的结果。

这是一个证明这一点的jsfiddle:http://jsfiddle.net/j7hjU/

在做这些事情时,我是否可能会忽视某些事情?

3 个答案:

答案 0 :(得分:4)

  

我假设css wouuld在应用:nth-​​of-type

之前过滤:not items

不。 CSS完全是声明性的;每个选择器都是一个简单的条件,它是真或假的,与任何选择器部分无关。它不是一种过程语言,你可以使用它来处理它并逐步缩小它。具有程序规则的选择器语言可以免于多种优化,并且速度会慢一些。

所以nth-of-type只是关于元素父级中的位置,而不是位于“结果列表到目前为止”,因为CSS选择器没有这样的概念。选择器引擎可以在使用nth-of-type缩小范围之前查找not的测试,因为规则不会相互干扰。

答案 1 :(得分:0)

这似乎与此问题重复:Css coloring table problem

答案基本上是,不,但您可以将类应用于可见行以使其有效。

答案 2 :(得分:-2)

CSS从右向左解析。您是否尝试过翻转:not:nth-of-type

Why do browsers match CSS selectors from right to left?