定位父类中的类的最后一个实例

Question

我说过divs：

<div>
    <div class="p1"></div>
    <div class="p2"></div>
    <div class="p1"></div>
    <div class="p2"></div>
</div>
<div>
    <div class="p1"></div>
    <div class="p2"></div>
    <div class="p1"></div>
    <div class="p2"></div>
</div>

我想在每个父div中设置最后一个p1 div的样式。我已经尝试了一些最后的代码，但是不想接受。有任何想法吗？

Answer 1

这不能用纯 css 来完成。我推荐使用 jquery：

$("div").find(".p1:last").css("color", "red");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <div class="p1">not</div>
  <div class="p2">not</div>
  <div class="p1">this</div>
  <div class="p2">not</div>
</div>
<div>
  <div class="p1">not</div>
  <div class="p2">not</div>
  <div class="p1">this</div>
  <div class="p2">not</div>
</div>