CSS边界线消失的问题详解

先来看看下图,经常会在一些导航栏中见到,要求每行中最后一列的右边框消失,如何在所有浏览器中最便捷优雅的实现? 如果是不需要兼容 IE8- ,那么使用 CSS3 新增的选择器无疑是一种好方法。 // 使用伪类选择器,选择第 3n 个元素去掉边框 li:nth-child(3n){ border-right:none; } 当然,如果个数确定也不多,给需要去掉右边框的元素直接添加一个特定的 class 也就完事。或者,使用 table 虽然繁琐一点,不过也能实现。 不过这样都不够优雅。 这里有个小技巧,就是通过添加反向边框并且增加一个负的 margin 来实现。 首先,假定我们的 ul