使用 :not(:last-child) 可精准排除最后一个子元素，常用于添加分隔线、间距控制及类名组合优化，提升样式灵活性与可维护性。
在CSS中，
:last-child
:not()
有时你希望对除最后一个子元素外的所有子元素应用样式。例如，在一个列表中为每个项添加下边框，但最后一个不需要。
示例：给所有不是最后一个的列表项添加分隔线：
.list li:not(:last-child) {
border-bottom: 1px solid #ccc;
}这样，只有非末尾的
li
立即学习“前端免费学习笔记（深入）”；
当容器中包含多种类型的子元素（如
div
p
span
在一个内容区域中，只对非最后一个段落添加间距：
.content p:not(:last-child) {
margin-bottom: 1em;
}这确保即使后面还有其他元素（比如图片或按钮），只要该段落不是整个父容器的最后一个子元素，就会保留底部间距。
你可以将
:not()
选择所有子元素中不是
.highlight
.container > :not(.highlight):not(:last-child) {
margin-right: 10px;
}这种写法常用于布局微调，比如让普通项有间距，高亮项和最后一项无右边距。
示例2：如果你想选中“是最后一个子元素但没有某个类”的元素：
.item:last-child:not(.sticky) {
padding-bottom: 20px;
}这在处理固定定位或特殊状态项时很有用，比如最后一个普通项需要额外留白。
在复杂DOM结构中，可结合后代选择器或直接子代操作，精准命中目标。
比如：在一个卡片组件中，希望每个区块内的段落之间有间距，但最后一个段落不加。
.card .section p:not(:last-child) {
margin-bottom: 8px;
}注意这里作用范围是每个
.section
p
基本上就这些。合理利用
:not(:last-child)
以上就是如何通过css:last-child和not伪类实现复杂选择的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
577
收藏
