使用 :last-child 伪类可去除列表最后一项边框，如 ul li:last-child { border-bottom: none; }，但需确保 li 是父元素最后一个同级子元素，否则可用 :nth-last-child(1) 或 :not(:first-child) 替代。
直接用 :last-child 伪类给列表最后一项设置 border: none 即可去除边框，前提是边框原本是通过父元素或每个 li 统一加的。
假设你用的是上下边框或底部边框：
ul li {
border-bottom: 1px solid #ccc;
}
ul li:last-child {
border-bottom: none;
}:last-child 匹配的是其父元素中**最后一个同级子元素**。常见踩坑点：
ul 里除了 li 还有其他元素（比如注释、空格文本节点不影响，但 <div> 或 <code>> 标签会），li:last-child 可能不生效
flex 或 grid 布局，且设置了 flex-wrap，仍以 DOM 顺序为准，不是视觉最后一行:last-child 不管换行，只看 HTML 结构顺序如果结构复杂，或需要兼容老浏览器，可用 :nth-last-child(1)，效果和 :last-child 一样，但语义更明确：
立即学习“前端免费学习笔记（深入）”；
ul li:nth-last-child(1) {
border-bottom: none;
}或者用 :not(:first-child) 反向思路——给除第一项外的所有项加顶边框，自然最后一项没多余边框：
ul li:not(:first-child) {
border-top: 1px solid #ccc;
}例如横向菜单：
nav li {
border-right: 1px solid #999;
}
nav li:last-child {
border-right: none;
}li，:last-child 就是最简洁可靠的方式。
以上就是css列表最后一项去掉边框怎么写_使用last child伪类的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
706
收藏
取消收藏
