所以我尝试使用Google搜索,但发现很难获得正确的搜索字词。
我试图仅在某个类上命名一个伪选择器
在此示例中,如果没有该类,则最后Hi
应为蓝色。我希望这段代码能够将第二个span
蓝色变为蓝色,而事实并非如此。我做错了什么,或者我对CSS应该做什么有不合理的期望?
span.dinosaur:last-child {
color: blue;
}

<body>
<span class='dinosaur'>Hi</span>
<span class='dinosaur'>Hi</span>
<span>Hi</span>
<span>Hi</span>
</body>
&#13;
答案 0 :(得分:4)
我希望这段代码可以将第二个
span
蓝色变为蓝色,但事实并非如此。
你对:last-child
伪类有一个根本的误解;它仅在应用伪类的元素时才匹配,仅当该元素是其父元素的最后一个子元素时才匹配。 not 等同于:last-of-type()
选择器(甚至 伪类忽略了类名和id
,并根据它选择了一个元素元素类型(<div>
,<p>
等)。
将来,:nth-match()
可能会达到您的目的,但在任何浏览器中都有待实施(据我所知),并且是Selectors Level 4模块的一部分
参考文献: