css - 带有 anchor 标记的最后类型在 CSS 中不起作用

Question

<分区>

Answer 1

发生这种情况是因为 a 是其父级标签类型的最后一个。

换句话说，选择器.element:last-of-type 不会选择类为.element 的最后一个元素。相反，它选择一个元素，该元素应用了 .element 类并且同时是 sibling 中该类型的最后一个。

考虑以下示例:

.element,
.square {
  display: inline-block;
  vertical-align: middle;
  width: 20px;
  height: 20px;
  background: red;
}

.element:last-of-type {
  background: blue;
}

<div>
  <!-- is last of type "p" AND has ".element" 
       class applied - will be matched -->
  <p class="element"></p>
  <span class="element"></span>
  <span class="element"></span>
  
  <!-- last of type "span" and has ".element" 
       class applied - will be matched -->
  <span class="element"></span>

  <!-- last of type, but does NOT have an ".element" 
       class applied - will NOT be matched -->
  <a class="square"></a>
</div>