使用[firstoftype定义]非常简单,只需要在CSS选择器中添加:first-of-type伪类即可。以下是使用[firstoftype定义]的步骤: 第一步:了解HTML结构 在使用[firstoftype定义]之前,我们需要了解页面的HTML结构,确保要选择的元素都具有相同的类型,并且是同一个父元素的子元素。 第二步:选择器语法 在CSS中,选择器可以根据...
就会选择到最后一个div,设置的紫色背景也会生效: 那既然查了这么多了,不如就趁此机会复习一下很多人一直没搞清楚的几个css伪类选择器: :first-child & :first-of-type :first-child:选取在一组兄弟元素中的第一个元素。 :first-of-type:选取在一组兄弟元素中的第一个指定元素。 解释一下:比如p:first-chi...
【CSS3】---first-of-type选择器+nth-of-type(n)选择器 first-of-type选择器 “:first-of-type”选择器类似于“:first-child”选择器,不同之处就是指定了元素的类型,其主要用来定位一个父元素下的某个类型的第一个子元素。 示例演示: 通过“:first-of-type”选择器,定位div容器中的第一个p元素(p不一...
CSS3 first-of-type选择器 “:first-of-type”选择器类似于“:first-child”选择器,不同之处就是指定了元素的类型,其主要用来定位一个父元素下的某个类型的第一个子元素。 示例演示: 通过“:first-of-type”选择器,定位div容器中的第一个p元素(p不一定是容器中的第一个子元素),并设置其背景色为橙色。
CSS3:first-of-type选择器 完整CSS选择器参考手册 实例 选择的 p 元素是其父元素的第一个 p 元素: p:first-of-type{background:#ff0000;} 尝试一下 » 定义和用法 :first-of-type 选择器匹配元素其父级是特定类型的第一个子元素。 提示:和 :nth-of-type(1) 是一个意思。
CSS :first-of-type 选择器实例 指定父元素的首个 p 元素的背景色:<!DOCTYPE html> p:first-of-type { background: red; } 第1个段落。 第2个段落。 第3个段落。 第4个段落。 运行一下浏览器支持 表格中的数字注明了完全支持该属性的首个浏览器版本。选择器 :first-of-type 4.0 9.0 ...
css选择器中:first-child与:first-of-type的区别 :first-child选择器是css2中定义的选择器,从字面意思上来看也很好理解,就是第一个子元素。比如有段代码: p:first-child h1:first-child span:first-child :first-child 然后,在css3中又定义了:first-of-type这个选择器,这个跟:first-child有什么区别呢?还是...
在CSS选择器中，有两个关键的区别选择器：`:first-child`和`:first-of-type`。`:first-child`选择的是一个元素作为其父元素的第一个子元素，关注的是结构上的顺序。例如，`p:first-child`匹配的是第一个``元素，因为它是其父元素``的第一个子元素。然而，`:first-of-type`则更进一步，它...
CSS3中的first-of-type选择器 first-of-type选择器类似于“:first-child”选择器,不同之处就是指定了元素的类型,其主要用来定位一个父元素下的某个类型的第一个子元素。 first-of-type选择器 类似于“:first-child”选择器,不同之处就是指定了元素的类型,其主要用来定位一个父元素下的某个类型的第一个子...
简介 这个代码CSS3 :first-of-type的意思不难理解，父元素的第一个字元素被定义样式。这里要注意元素之间的父子关系。工具/原料 dreamweaver 方法/步骤 1 应用代码。这个代码当中，它的父元素就是P。p:first-of-type{ background:#ff0000; } 2 完整style的流程。只要第一个这是第一个落。 有了颜色的变化。