:last-child 不生效解决

 结构：

    <div class="titleContent">
      <div>导航点击栏</div>
      <p>{
   { AthenaData.titleLabel }}</p>
      <h1>牌力觉醒 等你来斗</h1>
      <p>翻牌得门票，参赛赢好礼！</p>
      <div class="ticketInfo">
        我的入场券
        <span>初赛：1</span>
        <span>复赛：0</span>
        <span>决赛：0</span>
        <button>立即开斗</button>
      </div>
    </div>

想给 <p>翻牌得门票，参赛赢好礼！</p> 文字加粗：

样式：

p:last-child{
    font-weight: 700;
}
 

发现不生效。

解决办法：

p:last-of-type{
    font-weight: 700;
}

 总结：

        p:first-of-type ：同级结构内首次出现的P元素（无须在结构第一位）

        p:last-of-type ：同级结构内最后出现的P元素（无须在结构倒数第一位）

        p:first-child ：父元素下的第一个P元素（必须在结构第一位）

        p:last-child ：父元素（body除外）下的最后一个P元素（必须在结构倒数第一位）