1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > CSS选择器 :first-of-type/:last-of-type/ :first-child/:last-child 用法

CSS选择器 :first-of-type/:last-of-type/ :first-child/:last-child 用法

时间:2021-08-10 16:28:39

相关推荐

CSS选择器 :first-of-type/:last-of-type/ :first-child/:last-child 用法

官方链接:CSS3 :first-of-type 选择器

<div class="parent"><span class="child child1">child1</span><span class="child child2">child2</span><div class="child child3">child3<div>child3-1</div><div>child3-2</div></div><div class="child child4">child3<div>child4-1</div><div>child4-2</div></div></div>

:first-child 使用,是所有元素中的第一个满足条件就会被选中

// 设置 parent 下面的 第一个child 里面的字体颜色.parent .child:first-child {color: blue; // parent 下面的第一个元素 如果是 child 才会被选中}

:first-of-type使用,是每一个元素中的第一个都满足条件才选中

.parent .child:first-of-type {color: blue;// parent 下面 第一个满足该条件的元素如果是child就变成蓝色// 例如 我写的 第一个span/ 第一个div 都是 满足 child,就会被选中// 如果我的第一个span不是child,那么两个span 都不会被选中}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。