计一次css first-of-type引发的页面异常

先简单描述一下，有时间再整理 代码如下：

<style>
    .box-1:first-of-type span {
        color: red;
    }
    .box-1:nth-of-type(2) span {
        color: green;
    }
    .box-1:nth-of-type(3) span {
        color: yellow;
    }
</style>
<div class="common-bc-1">
    <div class="common-bc-1--title"></div>
    <!-- 编辑 -->
    <div class="box-1">
        <span>Comprehensive</span>
    </div>
    <div class="box-1">
        <span>Advanced targeting</span>
    </div>
    <div class="box-1">
        <span>Leverage line item</span>
    </div>
</div>
<div class="box">
    <div class="box-item"></div>
    <p class="box-1"><span>box1</span></p>
    <p class="box-1"><span>box2</span></p>
    <p class="box-1"><span>box3</span></p>
</div>

效果如下：

参考文档：developer.mozilla.org/zh-CN/docs/…