vue项目在v-for循环，使用first-child不生效

问题：v-for中使用：first-child不生效

<div class="faq-title">
        <span class="pos-rel">{{$t('amm.text_27')}}</span>
      </div>
     
        <div v-for="(item,index) in list"
             class="row-align-center content-row"
             :key="index">
          <div class="row-align-center">
            <div class="title-icon-wrap pos-rel">
              <img src="../../../../assets/image/exchange/faq-title.png"
                   class="titel-faq-icon"
                   alt="">
              <p class="pos-as title-index">{{`Q${index+1}`}}</p>
            </div>
          </div>
          <div class="content-right-wrap">
            <div class="title-label">{{item&&item.title||'--'}}</div>
            <div class="content-label"
                 v-html="item&&item.content&&item.content||'--'"></div>
          </div>
      </div>
      <style lang="less" scoped>
.amm-instruction {
  background: #f8fafb;
  min-width: 1280px;
  min-height: 1320px;
  .content-right-wrap {
    padding-left: 12px;
    box-sizing: border-box;
  }

  .content-row {
    box-sizing: border-box;
    &:first-child {
      margin-top: 30px;   //不生效
    }
    &.row-align-center {
      align-items: flex-start;
    }
  }
  </style>

解决方案：

1.一定要保证前面没有兄弟节点,要么就用div包住，在v-for节点加div包裹
2.img:first-of-type{}也能达到first-child的效果,且前面可以有节点
3.img:nth-of-type(1){}也能达到first-child的效果,且前面可以有节点

如果对你有帮助，欢迎点赞