CSS nth-match不起作用

Question

第n次匹配应该在jsfiddle下面的方式工作

:nth-match(even of p,h3) {text-decoration: underline;}

这应该强调每一秒p和h3元素.但是,它不起作用 - 无论是在FF还是在Chrome中:

http://jsfiddle.net/VUKQS/

哪里出了问题？

Answer 1

哪里出了问题？

问题在于,您将早期草稿中的想法和提议视为实际功能,通过使用它们期望它们可以工作,更不用说跨浏览器了.查看WD的状态:

这是一份草案文件,可能随时被其他文件更新,替换或废弃.除了正在进行的工作之外,引用此文档是不恰当的.

例证::nth-match() 不再存在.好吧,至少不是那种形式.它的功能(即接受匹配的选择器参数)并没有完全消失; 相反,它被归入:nth-child(),这个问题最初发布仅两周后.您可以在此看到的:nth-child()最新ED的部分.

这是因为,与传统的一样:nth-child(),它只匹配共享同一父节点的一组兄弟节点中的元素.旧名称意味着文档范围内的匹配,即作者希望以下内容匹配,但WD从未说过:

:nth-match(even of p) { text-decoration: underline; }

<p></p>
<div>
  <p></p> <!-- This should not match -->
</div>

旧名称已不再使用,您的小提琴可能永远不会在任何浏览器中使用.此外,自2013年5月以来还没有新的WD,所以它应该被认为是过时的.

随着我们说话,Selectors 4规范的这些重大变化仍在进行中,我不希望任何新功能很快就能实现.

Answer 2

CSS4选择器目前没有太多浏览器支持,请参见此处.

你可以使用nth-of-type一个CSS3选择器,它有更多的浏览器支持(见这里):

p:nth-of-type(even) {text-decoration: underline;}

DEMO