给定元素后代的CSS选择器

Question

鉴于以下html（我下面只包括三个div，但让我们想象还有更多的div）

<div id="1">
    <p>hi</p><p>Peter</p>
</div>
<div id="2">
    <p> hola</p><p>Peter</p>
</div>
<div id="3">
    <p>kaixo</p><p>Peter</p>
</div>

我希望有一个选择器为给定的<p>选择所有<div id="x">

CSS3允许你设计这样的选择器吗？

谢谢！

Answer 1

要选择给定<p>中的所有<div id="x">，您可以使用

#x p {
    // styling
}

#x选择ID =“x”的元素，#x p选择p后代的所有#x

Answer 2

考虑到所有ID应该是唯一的，将类分配给您想要挑出的元素不是更好吗？然后，不是选择所有ID（理论上只是一个，你会得到你想要的元素。

<div id="1" class="blue">
    <p>hi</p><p>Peter</p>
</div>
<div id="2" class="blue">
    <p> hola</p><p>Peter</p>
</div>
<div id="3" class="green">
    <p>kaixo</p><p>Peter</p>
</div>

.blue p {
    //styling
}