Question

我有以下标记和样式：

[class^="container"] .target:last-of-type {
  color:red;
}

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  <div class="container-1">
    <div class="item">1</div>
    <div class="item">2</div>
    <div class="target">3</div>
    <div class="item">4</div>
    <div class="item">5</div>
  </div>
  <br>
  <div class="container-2">
    <div class="item">1</div>
    <div class="item">2</div>
    <div class="item">3</div>
    <div class="item">4</div>
    <div class="target">5</div>
  </div>
</body>
</html>

我想选择.target元素，但前提是它是容器中的最后一个元素。

:last-of-type类适用于这种情况，我只是不明白为什么。它不应该突出显示.target个元素吗？它们是父容器中的最后一个（也是唯一的）元素。或者我误解了:last-of-type选择器？

目标元素只有在没有任何后续兄弟姐妹的情况下

0 个答案: