CSS：仅表格列之间的边框

有没有一种方法可以使用CSS在表格中只显示列之间的边框（而不是外部边框）？

我可能会简化这个问题，但确实如此 td{右边框：1px实心红色；}

---

为您的表格设置工作？

编辑2

伊拉斯谟有更好的一行

---

没有复杂的css选择器和额外的标记等等

类似的操作（使用CSS选择器）：

编辑

为了澄清@jeroen的评论，您真正需要的是：

table { border: none; border-collapse: collapse; }
table td { border-left: 1px solid #000; }
table td:first-child { border-left: none; }

---

桌子上的边框总是有点不规则。一种可能是向每个表单元格添加边框权限声明，但最右边列中的单元格除外。如果您使用任何表格间距，这将不会很好地工作

另一种选择是使用一张1px高的背景图像，其中有边框，但只有在保证每个单元格的宽度的情况下，这才有效

---

另一种可能性是使用colgroup/col进行试验。上次我查看它时，它对跨浏览器的支持非常糟糕，但从那时起可能会有所改进：

除了在每个tr的最后一个td上执行class=“lastCell”之类的操作，然后像这样设置css之外，没有简单的方法可以做到这一点：

#table td {
    border-right: 5px solid red
}

.lastCell {
    border-right: none;
}

Col1 | Col2 | Col3

---

您需要在td上设置一个

右边框

，然后以一行中的最后一个tds为目标，将边框设置为

无

。目标的方式：

在每行的最后一个

td

上设置一个类并使用该类

如果是固定数量的小区，并且只针对较新的浏览器，那么3个小区范围可以使用

td+td+td

或者更好（使用新浏览器）

td:last child

---

我在三列的样式表中使用了这一点，这三列之间用垂直边框隔开，效果很好：

#列左{
左边框：1px实心#dddddd；
}
#柱中心{
/*不需要边界/*
}
#右栏{
右边框：1px实心#dddddd；
}

左边的列在右边有一个边框，右边的列在左边有一个边框，中间的列已经由左边和右边负责了

---

如果列位于div/wrapper/table/etc中。。。别忘了添加额外的空间以适应边框的宽度。

我知道这是一个老问题，但有一个简单的、单行的解决方案，它对Chrome、Firefox等，以及IE8及以上版本（大部分情况下也适用于IE7，详情请参阅）：

输出如下所示：

#table td {
    border-right: 5px solid red
}

.lastCell {
    border-right: none;
}

Col1 | Col2 | Col3

这样做的原因是，您只在与另一个表单元格相邻的表单元格上定义边框。换句话说，您将CSS应用于一行中除第一个单元格外的所有单元格

---

通过将左边框应用于第二个到最后一个子元素，它给出了“在”单元格之间的线条的外观。

在

内部，使用

style=“border left:1px solid”颜色

请参见表格的

规则

属性-

获取一个带有类名

列边框表格

的表格，然后将其添加到css下方。这也适用于

引导

表格

.column-bordered-table thead td {
    border-left: 1px solid #c3c3c3;
    border-right: 1px solid #c3c3c3;
}

.column-bordered-table td {
    border-left: 1px solid #c3c3c3;
    border-right: 1px solid #c3c3c3;
}

.column-bordered-table tfoot tr {
    border-top: 1px solid #c3c3c3;
    border-bottom: 1px solid #c3c3c3;
}

请参见下面的输出
N:B您必须根据需要添加表头背景颜色

---

否，因为这样在表格右侧将有一个边框。我不希望在表的右边缘或左边缘上有边框，只在列之间。如果将类应用于最后一列，则可以从最后一列中删除右边框声明。它确实需要手动调整，但如果是静态页面，那么它实际上是最好的解决方案。注意：IE6-8不支持

：last child

（关于

：第一个孩子
，根据只使用左边框，那么就没有必要使用
：最后一个孩子
@jereon:是的，我并没有认真考虑过。但基本点是一样的。我的评论主要是针对斯科特提出的问题；我完全同意你的答案，就我而言，你甚至可以去掉第一行：-）+1为ie8使用selectivizr:last childs这是一个相当糟糕的建议-CSS为相对较新的（ie8+）提供了一个简单的方法来优雅地完成这一点。记住这个答案（和问题）都是从2010年开始的，也就是五年前，当时IE6仍然受到许多开发者的积极支持。此外，当时实现表格边框的CSS方法对于几乎所有可用的HTML电子邮件渲染器来说都是不可能的。不过，感谢亡灵巫术！哈哈，我没意识到，因为公认的答案只编辑了几次几周前：）。我认为问题的核心是“使用CSS设置表格样式”，而不是将CSS放在特定的位置。这绝对值得注意，因为它仍然有效且非常简单。您将如何在HTML中执行此操作？是的，这绝对是更好的解决方案