:first-child 的坑（first-child的伪类选择器不起作用）

比如下面的代码，刚开始不知为什么 ：first-child的伪类选择器不起作用，而last-child却有作用

<div class="procedureWrap">    <div class="procedure_info">尊敬的用户您好，您的入职流程需要按照如下步骤进行操作，了解流程后即可前往填写相关信息</div>    <div class="procedure">填写入职资料和身份信息<br />(包括身份证账号和照片等)</div>    <div class="arrow"></div>    <div class="procedure">查看相关规章制度并确认</div>    <div class="arrow"></div>    <div class="procedure">签劳动合同阅读并手写签字等等</div>    <div class="arrow"></div>    <div class="procedure">社保信息录入和工资卡信息填写</div></div>.procedure:first-of-child{margin-bottom: 4px;height: 48px;line-height: 18px;}

后来查阅有关资料发现：

使用:first-child伪类时一定要保证前面没有兄弟节点，把

<div class="procedure_info">尊敬的用户您好，您的入职流程需要按照如下步骤进行操作，了解流程后即可前往填写相关信息</div>

去掉就可以；或者使用div包住

<div class="procedure_info">尊敬的用户您好，您的入职流程需要按照如下步骤进行操作，了解流程后即可前往填写相关信息</div>

下面的内容，然后css：

procedure:first-child