first-child和first-of-type的区别在哪里

first-child和first-of-type的区别

从字面上就很容一理解first-child是结构上的第一个孩子而first-of-type是相同类型的第一个

下面来举例子说明下

//通过p：first-of-type可以得到这个元素

下面是first-child

• 咖啡
• //它属于父元素的第一个孩子，而且是li标签所以它的背景颜色变为黄色
• 茶
• 可口可乐

fgdhfjh

1. 咖啡
2. //它在结构上不是第一个所以它的背景颜色不会变为黄色
3. 茶
4. 可口可乐

注释：对于 ie8 及更早版本的中的 :first-child，必须声明 。