1 1、使用li标签创建一个列表，用于测试。 2、设置ul标签的class属性值为myway，用于设置样式。 3、在css标签内，通过class和“:first-child”选择器选中第一个li元素。 4、在css标签内，设置第一个li元素的内容颜色为红色，并且加粗显示。 5、在浏览器打开test.html文件，查看实现的效果。
:first-child 方法/步骤 1 :first-child伪类元素选择器初识 2 新建一个HTML文档，包含两个<P>元素 3 选择P元素，且是其父元素的首个子元素，设置背景色 4 保存文件查看，显示效果 5 调换P和H1的位置，让P成为BODY的第一个子元素 6 保存后，再次查看消失效果 7 :first-child 使用总结：注意事项 理解first-...
3.class选择器 可以同时选取 不同 的元素 <!DOCTYPE html><htmllang="en"><head><metacharset="UTF-8"><title>Title</title><style>/*3.class选择器 可以选取 不同 的元素*/.tycs{height:50px;width:140px;background:deeppink;}</style></head><body><divclass="tycs">测试通用元素匹配1</div><...
1.first-child 选择列表中的第一个标签 li:first-child{color:red} 2. last-child 选择列表中的最后一个标签 li:last-child{color:pink} 3.nth-child(n) 这里的n为数字,表示选择列表中的第n个标签 例如选择第三个标签 li:nth-child(3){color:pink} 4.nth-child(2n) 选择列表中的偶数,选中 2、4、6...
:first-child选择器 :first-child是一个伪类选择器,用于选择作为其父元素的第一个子元素的元素。换句话说,如果一个元素是其父元素的第一个子元素,那么它将被:first-child选择器选中。 示例 <div class="parent"> <p>第一个段落</p> <p>第二个段落</p> <p>第三个段落</p></div> ...
子选择器用>表示,匹配第一个元素的直接后代的第二个元素(即 child)。后代选择器只需要用空格隔开,不要求是直接后代(即 descendant)。 p span{ /* 所有 p 元素中的 span 元素 */ color:red; } p > span{ /* 所有 p 元素中的直接子元素 span 元素 */ color:blue; } <p> <span>p span和p>span...
:first-child选择器是css2中定义的选择器,从字面意思上来看也很好理解,就是第一个子元素。比如有段代码: p:first-child h1:first-child span:first-child :first-child 然后,在css3中又定义了:first-of-type这个选择器,这个跟:first-child有什么区别呢?还是看那段代码: ...
The :first-child selector matches the first child element.:first-child is a Pseudo-class and it applies to any element that is the first child of another element. With :first-child pseudo-class, an element is matched only when it is the first child of another element. For example, p:...
:first-child 单独使用这个选择器不带任何前缀,选择的是作为 “某个元素” 的 “第一个子元素” 的元素 ,某个元素是文档里的任意元素(即所有元素),第一个子元素可以是任意的元素,要想明白这个子元素,很好的一个方式是使用jquery,在浏览器控制台使用 $(":last-child") 查看选择出来的元素就可以一目了然。
div:first-child>p:first-of-type{/* CSS code */} 什么是 CSS First of Class CSS 选择器选择您想要设置样式的元素。 最基本的选择器是元素选择器,它用于通过标签名称选择元素。 例如,元素选择器 p 将选择页面上的所有 元素。 类选择器用于通过类名选择元素。 例如,类选择器 .example 将选择所有带有类 ...