第二章 CSS3新增的选器之 选择器 last-child last-of-type区别
来源:互联网 发布:那些大网站用的cn域名 编辑:程序博客网 时间:2024/06/05 04:31
last-child, last-of-type是CSS3新增的结构伪类选择器,这两者功能相似,如果不仔细区分,可能会造成使用上的误解。现在举例说明这两者的区别,
选来看一下以下例子
<body>
<div>
<p>第一行</p>
<p>第二行</p>
<p>第三行</p>
</div>
</body>
针对以上代码段:
p:last-child ,p:last-of-type将会配置到<p>第三行</p>
但针对以下代码段
<body>
<div>
<p>第一行</p>
<p>第二行</p>
<p>第三行</p>
<span>我是测试行</span>
</div>
</body>
p:last-child 将不能匹配任何对象,p:last-of-type将会配置到<p>第三行</p>
所以现在明白了吗?
last-child 是指匹配的对象是其所在的父元素的最后一个元素
last-of-type是指匹配的对象是其所在的父素的最后一个相同类型元素
2 0
- 第二章 CSS3新增的选器之 选择器 last-child last-of-type区别
- jQuery 选择器 first-child和first-of-type、 last-child和last-of-type的区别
- 【CSS3】last-of-type选择器
- 【Web前端】CSS 选择器之 last-child 与 last-of-type
- 【CSS3】nth-last-of-type(n)选择器
- CSS3 :nth-child() ,nth-of-type(),nth-last-child() ,nth-last-of-type()
- first-child first-of-type last-child last-of-type 伪类选择器总结
- last-of-type选择器
- 【CSS3】---last-of-type选择器+nth-last-of-type(n)选择器
- nth-child,nth-of-type,first-of-type,last-of-type,nth-last-of-type,only-of-type等的区别
- nth-last-of-type选择器
- :last-child与:last-of-type你只是会用,有研究过区别吗?
- 【CSS3】---结构性伪类选择器-first-child+last-child
- :last-child 选择器
- css3中nth-child选择器和nth-of-type选择器的区别
- 【CSS3】结构性伪类选择器—last-child
- 【CSS3】结构性伪类选择器—nth-last-child(n)
- jquery 的:first-child 和:last-child 选择器实例
- 冒泡排序和选择排序
- hadoop完全分布ssh免密码登录
- unity3D打包成apk
- ASP中recordset所有的属性与方法 简介
- 研究生第一篇学术论文常犯问题总结【喻海良箴言】
- 第二章 CSS3新增的选器之 选择器 last-child last-of-type区别
- uCOS-II任务间通信之邮箱 [转载]
- 打印数字
- 【BZOJ2219】数论之神
- LeetCode 39. Combination Sum
- Visual Profiler介绍
- Spring基础小实例
- Java编程基础-反射
- 详解二进制文件和文本文件的区别暨换行和回车详解