是否可以定位类 div 中的最后一个元素？CSS

Question

我知道如果它们使用相同的类或者它们是相同的元素，我可以定位最后一个元素。但我构建的方式是用户将在其中放入任何元素（请参阅随附的示例）。只是想知道现在还可以通过CSS调用吗？或者说 CSS 无法做到这一点？

.header p:last-of-type{
  color: red;
 }

<div class="header">
  <h1>I am numbe one</h1>
  <h3>number two</h3>
  <p>something</p>
  <p>something</p>
  <button>last one - red</button>
</div>

<div class="header">
  <h1>I am numbe one</h1>
  <h3>number two</h3>
  <p>last one - red</p>
</div>

<div class="header">
  <p>number 1</p>
  <h1>something</h1>
  <h3>last one - red</h3>
</div>

Answer 1

如果您尝试将样式添加到最后一个类中的color: red;最后一个标签，那么您应该使用 CSS 选择器：<p>class='header'

CSS：

.header:last-of-type p:last-of-type {
    color: red;
}

您可以查看此工作代码示例。

编辑：

如果您想使用 来定位每个标签的最后一个元素class='header'，您可以像这样完成它：

CSS：

.header *:last-child {
  color: red;
}

检查工作代码示例。