html - 在多级其他标签中选择某种类型的第一个标签

Question

我需要将样式应用于特定类型标签内的特定类型的每个子标签，但我不知道正确的 CSS 选择器组合。

例如，在这个标记中，我想选择所有说的标签Select me并将它们变成蓝色，而不是任何其他标签：

<i>Don't select me</i>

<div>
    <p>
        <i>Select me</i>
    </p>
    <p>
        <i>Don't select me</i>
    </p>
</div>

<div>
    <p>
        <b>Don't select me</b>
    </p>
    <p>
        <i>Select me</i>
    </p>
</div>

我试过这个：

div i:first-of-type {
    color: blue;
}

但它会i选择div.

我也试过

div p:first-of-type i:first-of-type {
    color: blue;
}

但显然这不会得到第二个Select me，因为它在第二个p标签中。

这是一个演示：http: //jsfiddle.net/eEHvp/

Answer 1

使用 CSS3选择器，您尝试做的事情是不可能的。

first-of-type和first-child等是相对于他们的直接父母。