CSS中:first-of-type和:last-of-type用法详解
2026-01-10 22:01:08
0浏览
收藏
大家好，我们又见面了啊~本文《CSS中:first-of-type和:last-of-type选择器的使用方法》的内容中将会涉及到等等。如果你正在学习文章相关知识，欢迎关注我，以后会给大家带来更多文章相关文章，希望我们能一起进步！下面就开始本文的正式内容~
:first-of-type匹配父元素中同类型标签的第一个，而非DOM首个子元素；如父元素内有p、div、p，则首p匹配，次p不匹配，且忽略文本/注释节点。
为什么 :first-of-type 并不等于「第一个子元素」
它匹配的是其父元素中**同类型标签的第一个出现**，不是按 DOM 顺序排的第一项。比如父元素里先有 常见误用场景：想给列表第一个 、再有 、又一个 ，那么第二个 不会匹配 :first-of-type，但第一个 会——即使它前面还有别的标签。
加样式，却在父 li:first-of-type，结果发现没生效。原因可能是 。此时 :first-of-type 仍有效，但你得确认目标 确实是所有 中的第一个。