在以上八个伪类选择器中,:first-child:last-child:nth-child(n):nth-last-child(n)在选择元素时,是按照其所有类型的兄弟元素开始计数,而:first-of-type:last-of-type:nth-of-type(n)nth-last-of-type(n),是按照其兄弟元素中,忽略除该元素以外的所有其他元素后开始计数的。 还没搞懂也没关系,你只需要记...
“:first-of-type”选择器类似于“:first-child”选择器,不同之处就是指定了元素的类型,其主要用来定位一个父元素下的某个类型的第一个子元素。 示例演示: 通过“:first-of-type”选择器,定位div容器中的第一个p元素(p不一定是容器中的第一个子元素),并设置其背景色为橙色。 HTML代码: 我是一个块元素...
:first-of-type 匹配的是该类型的第一个,类型是指什么呢,就是冒号前面匹配到的东西,比如 p:first-of-type,就是指所有p元素中的第一个。这里不再限制是第一个子元素了,只要是该类型元素的第一个就行了,当然这些元素的范围都是属于同一级的,也就是同辈的。 同样类型的选择器 :last-child 和 :last-of-t...
1、::first-line | 选择首行文本 这个伪元素选择器选择换行之前文本的首行。 p:first-line { color: lightcoral; } 2、::first-letter | 选择首字母 这个伪元素选择器应用于元素中文本的首字母。 .innerDiv p:first-letter { color: lightcoral; font-size: 40px } 3、::selection | 选择高亮(被选中...
first-of-type选择器 “:first-of-type”选择器类似于“:first-child”选择器,不同之处就是指定了元素的类型,其主要用来定位一个父元素下的某个类型的第一个子元素。 示例演示: 通过“:first-of-type”选择器,定位div容器中的第一个p元素(p不一定是容器中的第一个子元素),并设置其背景色为橙色。
:first-child选择器是css2中定义的选择器,从字面意思上来看也很好理解,就是第一个子元素。比如有段代码: p:first-child 匹配到的是p元素,因为p元素是div的第一个子元素; h1:first-child 匹配不到任何元素,因为在这里h1是div的第二个子元素,而不是第一个; ...
:first-of-type 选择器匹配元素其父级是特定类型的第一个子元素。 提示:和 :nth-of-type(1) 是一个意思。 浏览器支持 表格中的数字表示支持该属性的第一个浏览器版本号。 选择器 :first-of-type4.09.03.53.29.6 完整CSS选择器参考手册 CSS 参考手册 ...
CSS3 first-of-type选择器 “:first-of-type”选择器类似于“:first-child”选择器,不同之处就是指定了元素的类型,其主要用来定位一个父元素下的某个类型的第一个子元素。 示例演示: 通过“:first-of-type”选择器,定位div容器中的第一个p元素(p不一定是容器中的第一个子元素),并设置其背景色为橙色。
css选择器中first-child与first-of-type的区别 :first-child选择器是css2中定义的选择器,从字面意思上来看也很好理解,就是第一个子元素,匹配其父元素中的第一个子元素。 比如有段代码: p:first-child 匹配到的是p元素,因为p元素是p的第一个子元素;h2:first-child 匹配不到任何元素,因为在这里h2是p的第二...
选择器例子例子描述CSS :first-of-type p:first-of-type 选择属于其父元素的首个 p 元素的每个 p 元素。 3 :last-of-type p:last-of-type 选择属于其父元素的最后 p 元素的每个 p 元素。 3 :only-of-type p:only-of-type 选择属于其父元素唯一的p 元素的每个 p 元素。 3 :nth-of-type(n) p...