帮助伪类，第一个孩子

Question

我正在使用有限访问模板文件的CMS平台，并且想要尝试使用伪类控制某些布局，但没有运气。任何人都可以看到这个结构有什么问题，为什么我的伪类被忽略？

<div id="main"> 
    <div class="someRandomDiv"></div> 
    <div class="block"> 
    stuff 
    </div> 
    <div class="block"> 
    more stuff 
    </div> 
</div> 

，我想这样的事情

#main .block {border: 1px solid blue} 
#main .block:first-child {border: 1px solid red} 

这个例子中，我会想的东西块将有一个红色的边框和更多的东西会有一个蓝色

左右，但一切只不过是蓝色的。

感谢您的任何帮助。

Answer 1

它没有被忽略，也就是没有任何这有点违反直觉的比赛:)

我知道，但:first-child字面意思的父母，而不是类型的的第一个孩子，父母，所以在您的代码中唯一匹配:first-child的是<div class="someRandomDiv"></div>。

随着.block:first-child你说，有一类block和是他们的父母的第一个孩子，这不是说“第一个与block类”元素......他们自主选择和Don”这里重叠。所以，没有匹配，因为没有元素符合两个条件，这更有意义？

它不支持所有的浏览器，但你可以在jQuery中使用:nth-child()或JavaScript做你想做什么，比如那就是：

$("#main .block:first").css({ border: '1px solid red' });