仅在元素之间的边界

Question

我需要知道如何在我的项目之间建立边框,如下图所示:

我尝试使用border-right和-left,但最后一项不应该有border-right.

我的CSS:

border-top: 1px solid #000;
border-right: 1px solid #000;

如何应用border-right除行上最后一个元素以外的所有元素？

Answer 1

有一种更好的方法可以在旧版浏览器中运行:http://jsfiddle.net/mxV92/.

您只需在左侧为每个紧跟在另一个项目后面的项目应用边框:

ul > li + li {
    margin-left: 5px;
    padding-left: 5px;
    border-left: 1px solid #bbb;
}

Answer 2

如果我理解正确,你想要的是在所有项目的右边有边框,除了最后一项.

你可以使用'last-child'选择器.例如,如果您的对象位于类'foo'的'div'中,那么您的CSS可能如下所示:

div.foo {
   border-width: 1px 1px 0 0;
   border-color: #000;
   border-style: solid;
}

div.foo:last-child { border-width: 1px 0 0 0; }

这表示类'foo'的div应该有纯黑色边框,顶部和右边的宽度为1px('border-width'后面是顶部,右边,底部,左边的宽度),除了最后一个item,其中宽度为'1px'仅在顶部.

':last-child'应该得到大多数现代浏览器的支持.

Answer 3

将其添加到您的中，每四本书style.css就关闭一次。border-right（这仅适用于该网站的桌面版本。）

.nspArt:nth-child(4n) .gkResponsive img.nspImage {
    border-right: none;
}