CSS选择器first-child不起作用

Question

我试过使用：nth-​​child（n），它不能正常工作，我在错误的元素上使用这个选择器吗？ 在元素div上使用以下类，block_photo。

>

http://tmptstdays4god.ucoz.com/

Answer 1

您的html标记如下：

<section class="new photos">
    <h4 class="title">...</h4>
    <div class="block-photo">...</div>
    <div class="block-photo">...</div>
    ...
</section>

第一个孩子/第n个孩子

匹配元素，如果它是第一个孩子。

.block_photo:first-child {
    /* styles here apply to the .block_photo IF it is the first child */
}

在您的情况下，因为第一个孩子是<h4>，所以选择器.block_photo:first-child不匹配任何元素。

第一个类型/第n个类型

匹配某种类型的第一个元素

.block_photo:first-of-type {
    /* styles here apply for the first .block_photo element */

    /* that is what you need */
}

参考文献：

this SuperUser answer
W3C specification on first-child