:first-child直接选择第一个子元素,不考虑类型。 :first-of-type选择第一个特定类型的子元素,即使它不是第一个子元素。
:nth-child只考虑元素在父元素中的位置,而不考虑元素的类型。 如果要选择第二个p元素,需要使用:nth-of-type(2)。 总结: :first-child: 选择父元素的第一个子元素。 :first-of-type: 选择父元素中特定类型的第一个子元素。 :nth-child(n): 选择父元素的第 n 个子元素 (无论类型)。 希望这些例子能清...
p:first-of-type h1:first-of-type span:first-of-type :first-of-type 所以,通过以上两个例子可以得出结论: :first-child 匹配的是某父元素的第一个子元素,可以说是结构上的第一个子元素。 :first-of-type 匹配的是该类型的第一个,类型是指什么呢,就是冒号前面匹配到的东西,比如 p:first-of-type,就...
:first-of-type 选择器选取属于其父元素的特定类型的第一个子元素的所有元素。 语法 $(":first-of-type") <!DOCTYPE html>$(document).ready(function(){ $("p:first-of-type").css("background-color","yellow"); });body 中第一个段落。div 中第一个段落。div 中的最后一个段落。这是一个 span...
区别::first-child匹配父元素中的第一个子元素,可以说是结构上的第一个子元素;而:first-of-type匹配父元素下相同类型子元素中的第一个,不再限制是第一个子元素了,只要是该类型元素的第一个就行了。 css选择器中first-child与first-of-type的区别
定义:first-child选择器用于选取属于其父元素的首个子元素的指定选择器。 first-of-type选择器匹配属于其父元素的特定类型的首个子元素的每个元素。 定义的...
区别::first-child匹配父元素中的第一个子元素,可以说是结构上的第一个子元素;而:first-of-type匹配父元素下相同类型子元素中的第一个,不再限制是第一个子元素了,只要是该类型元素的第一个就行了。 【推荐教程:CSS视频教程 】 css选择器中first-child与first-of-type的区别 ...
在CSS选择器中,有两个关键的区别选择器:`:first-child`和`:first-of-type`。`:first-child`选择的是一个元素作为其父元素的第一个子元素,关注的是结构上的顺序。例如,`p:first-child`匹配的是第一个``元素,因为它是其父元素``的第一个子元素。然而,`:first-of-type`则更进一步,它...
first-child,last-child,nth-child,first-of-type,last-of-type 用法 first-child类似 , 但是first-of-type是以元素类型为列表,来选择的如图一:选择的是p类型的第一个p,即符合左边选择器条件的第一个5. last-of-type见...: 选中A元素父元素的第一个为A元素来看代码 图1中这样的样式浏览器未发现样式改变...
CSS3 中关于 *-of-type 和 *-child的差异性及适用场景,css3中有很多表示元素序号的选择器,有以下几种:first-child、:first-of-type、:last-of-type、:only-of-type、:only-child、:nth-child(n)、:nth-last-child(n)、:nth-of-type(n)、:nth-las