以CSS嵌套伪选择器结构中的最后一个子子为目标。

Question

目标:在同级根子元素类型具有相同类型的嵌套子元素的结构中，只对特定html元素类型的最后一个“根”子元素进行样式化。

问题：所有嵌套的子程序都会在根子类之外进行样式化。

示例:考虑到以下较大结构的块，我只想针对'GOLD‘span，它始终是父div中span类型的最后一个子子。

​

div span:last-child {
  color: gold;
}

<div>0

  <span>1
      <span>2
        <span>3
        </span>
      </span>
  </span>

  <br/>

  <span>a
      <span>b
        <span>c
        </span>
      </span>
  </span>

  <span>GOLD
  </span>

</div>

​

Answer 1

在>之后添加div

​

div>span:last-child {
  color: gold;
}

<div>0

  <span>1
      <span>2
        <span>3
        </span>
  </span>
  </span>

  <br/>

  <span>a
      <span>b
        <span>c
        </span>
  </span>
  </span>

  <span>GOLD
  </span>

</div>

​