使用表格标签时出现问题

Question

我正在尝试使用table标签来构建我网站的一部分。基本上，我想要一个三列表，每列彼此分开并且在它周围有一个样式边框（例如1px solid＃000000）。

我知道每个表格列都不能用CSS使用边距分隔，所以我使用了border-spacing和border-collapse属性，如下所示。

border-collapse:separate;
border-spacing:10px 50px;

上面的部分工作是柱子分开但是，我不能在每列上有一个周围的边界。

非常感谢任何想法。

Answer 1

我认为你需要将边框放在单独的td元素上。这很尴尬，因为这意味着你必须在顶部和底部行的td上放置顶部和底部边框。斯科特可能是正确的，你想要使用div代替，但是我们知道它是你正在显示的表格数据，你只是希望它以特定的方式设置。

编辑： 在这里，这似乎做你想要的，如果有点kludgy，并且在早期版本的IE上注意，firstChild和lastChild只能使用正确的DOCTYPE：

table { border-collapse: separate;  border-spacing:  2px 0; }

td { border: solid black;  border-width: 0px 1px;}

tr:first-child td {
border-top-width: 1px;
}

tr:last-child td {
border-bottom-width: 1px;
}

Answer 2

我认为您可以更好地提供指向您希望构建的数据/内容的页面链接。正如我在本文前面所述，我很想到嵌套的div会很好地为你服务。这变成了“讨论”而不是“回答”。

Answer 3

您可以考虑阅读<div>标记;这些天使用表格进行布局是不受欢迎的。

Answer 4

我同意斯科特的观点。表格用于数据。 Div用于格式化。如果你不熟悉层叠样式表，你可能还需要做一些关于它们的作业。