为什么选择器:last-child有时没有起作用?
2024-10-21 04:55:30
想要有.list样式的最后一个不要下划线。
为什么:last-child没有起作用?
el:last-child 的匹配规则是:第一步,查找 el 选择器匹配元素的所有同级元素(siblings);第二步,在同级元素中查找最后一个元素;第三步,检验最后一个元素是否与选择器 el 匹配。
.list:last-child 匹配到了 footer,但 footer 不匹配 .list,故选择器不生效。
1.可改成.list:nth-last-child(2)
2. 把所有.list标签用div包起来,保证最后一个子元素为.list
3.div .list:first-of-type{font-weight:blod}
这时候调试下就没问题了。
这里我们要理解下:first-child和:first-of-type 区别:
:first-child 指的是父元素的第一个子元素,例如我们本例子中要使用first-child实现的话,必须把h1标签去掉保证没有兄弟元素,或者单独把P标签包围起来;
:first-of-type 指的是父元素下相同类型子元素中的第一个,比如我们例子中的第一个p标签。
最新文章
- 由项目浅谈JS中MVVM模式
- 美萍超市销售管理系统标准版access数据库密码mp611
- EasyUI-validatebox 自定义validType验证
- little tips of painter.drawRect in Qt
- JPG渐进 & PNG/PNG24 交错测试
- iOS开发--关于TableViewCell的可视化设置细节
- C#异步编程简单的运用
- CENTOS install summary
- Spring整合CXF步骤,Spring实现webService,spring整合WebService
- ServiceContract,OperationContract
- ELK 基本搭建
- 结合prototype和xmlhttprequest封装ajax请求
- shell打印 倒等腰三角形
- darknet优化经验-AlexeyAB大神经验
- Oracle表空间管理相关
- window.open 浏览器差异.
- 图解SSH原理
- redis-cluster集群安装(基于redis-3.2.10)
- webgl学习笔记三-平移旋转缩放
- Hibernate持久化对象修改id重新保存的办法
热门文章
- vmvare ubuntu虚拟机固定ip设置
- JNI的开发步骤
- 003-Spring4 扩展分析-spring类初始化@PostConstruct >; InitializingBean >; init-method、ApplicationContext、BeanPostProcessor、BeanFactoryPostProcessor、BeanDefinitionRegistryPostProcessor
- Linux搭建ftp服务器简单教程及使用方法
- 堆的ptmalloc机制
- delphi 双击dbgrid 调用另一窗体的例子
- 【学习笔记】python3中yaml文件使用
- python网络应用篇
- 【Linux开发】linux设备驱动归纳总结(四):3.抢占和上下文切换
- python笔记之元祖