css:first-of-type介绍
css :first-of-type选择器用于匹配父元素的第一个特定子元素。
语法:
:first-of-type {
style properties
}
如:p:first-of-type用于匹配父元素里的第一个p元素。
css:first-of-type实例
设置其父级的第一个p元素的背景色
p:first-of-type
{
background:#ff0000;
}
This is a heading
The first paragraph.
The second paragraph.
The third paragraph.
The fourth paragraph.
/* /article/1306.html */
再看一个实例:
p:first-of-type
{
background-color:yellow;
}
码农教程
java教程
php教程
css教程
mysql教程
html教程
sql教程
js教程
运行结果如下:
p:first-of-type需要注意两点:
第一,是在整个HTML文档中匹配
第二,p:first-of-type选取的是父元素里的第一个子元素p标签,并不要求父元素的第一个子元素必须是p标签。
上面实例中,body的第一个p标签子元素为"
码农教程
",所以该元素会被选中。
同理“
mysql教程
”和"
sql教程
"作为div(class为div1和class为div2)元素的第一个p标签,所以也会被选中.