我们可以通过另外的方法选择奇数行,例如: nth-child(n+1) 、 nth-child(2n-1) 等。 代码如下: 代码语言:javascript 复制 /*First*/li:nth-child(n+1){background:#999;}/*Second*/li:nth-child(2n-1){background:#999;} nth-child(even)nth-child(even):选择列表的偶数行。 举例:偶数行背景显示为...
方法/步骤 1 :first-child伪类元素选择器初识 2 新建一个HTML文档,包含两个<P>元素 3 选择P元素,且是其父元素的首个子元素,设置背景色 4 保存文件查看,显示效果 5 调换P和H1的位置,让P成为BODY的第一个子元素 6 保存后,再次查看消失效果 7 :first-child 使用总结:注意事项 理解first-child的用法 ...
p:first-child{background-color:yellow;} 尝试一下 » 定义和用法 :first-child 选择器匹配其父元素中的第一个子元素。 浏览器支持 表格中的数字表示支持该属性的第一个浏览器版本号。 选择器 :first-child4.07.03.03.19.6 注意::first-child在IE8和更早版本IE版本中必须声明<!DOCTYPE> ...
:last-of-type和:last-child 这与:first-of-type 和 :first-child用法完全一致,表示最后一个,这里不做多讲解 有一点注意的是,:first-child是CSS2的范畴,意味着在IE8也能使用,而last-child是CSS3的规范,在同时都能满足需求时,如果需要更好的兼容性,建议使用:first-child。
p:first-child{ background-color:yellow; } 亲自试一试 浏览器支持 IEFirefoxChromeSafariOpera 所有主流浏览器都支持 :first-child 选择器。 注释:对于 IE8 及更早版本的浏览器中的 :first-child,必须声明<!DOCTYPE>。 定义和用法 :first-child 选择器用于选取属于其父元素的首个子元素的指定选择器。
1、first-child first-child表示选择列表中的第一个标签。代码如下: li:first-child{background:#fff} last-child用法: 1、last-child last-child表示选择列表中的最后一个标签,代码如下: li:last-child{background:#fff} :nth-child(2)选取第几个标签,“2可以是你想要的数字” ...
常见的一些用法就是 第一项 第N项 和 最后一项,这是开发中常用的选择要求 写法如下 :first-child...
:first-child选择器是css2中定义的选择器,从字面意思上来看也很好理解,就是第一个子元素。比如有段代码: p:first-child 匹配到的是p元素,因为p元素是div的第一个子元素; h1:first-child 匹配不到任何元素,因为在这里h1是div的第二个子元素,而不是第一个; ...
这里可以做个总结: 有name1 name2:last-child ,其中紧挨着:last-child的name2是用来对最后一个子元素名作限制的,也可以不写直接用name1 :last-child ,这样name2为空,代表不对元素名作限制,一般都是这样的用法,直接选择最后一个子元素,这样比较直观,也容易懂...