HTML 表需要列之间的间距，而不是行之间的间距

小开

最佳答案

If you can use inline styling, you can set the left and right padding on each td.. Or you use an extra td between columns and set a number of non-breaking spaces as @rene kindly suggested.

Http://jsfiddle.net/u5mn4/

Http://jsfiddle.net/u5mn4/1/

两者都相当丑陋; pcss ftw

小开

<table cellpadding="pixels"cellspacing="pixels"></table>
<td align="position"valign="position"></td>

在 <table>标签中使用的 cellpadd 属性指定了在每个表格单元格的内容和它各自的边框之间显示多少空白。该值定义为以像素为单位的长度。因此，cellpadding="10"属性值对将在表中每个单元格内容的所有四边显示10像素的空白。

cellspacing = “长度(以像素为单位)”~ cellspace 属性(也用于 <table>标签)定义了在相邻的表格单元格之间以及表格单元格和表格边框之间显示多少空白空间。该值定义为以像素为单位的长度。因此，cellspacing="10"属性值对将水平和垂直地将相应表中的所有相邻单元格分隔开，分隔长度为10像素。它还将使表格四边的所有单元格偏移10个像素的长度。

小开

更好的方法使用 Shredder 的 css 规则: pding: 015px 015px 定义一个适用于所有 tds 的 css 规则，而不是内联 css。在你的页面中使用一个样式标签:

<style type="text/css">
td {
padding: 0 15px;
}
</style>

或者给表一个类，比如“ paddingBebetween Cols”，并在站点 css 中使用

.paddingBetweenCols td {
padding: 0 15px;
}

站点 css 方法定义了一个可以被所有页面重用的中心规则。

如果您要使用站点 css 方法，那么最好像上面那样定义一个类并将填充应用到该类... ... 除非您希望整个站点上的所有 td 都应用相同的规则。

使用样式标签的小提琴

使用站点 css 的小提琴

小开

在大多数情况下，最好只在右边填充列，这样只填充列之间的间距，第一列仍然与表对齐。

CSS:

.padding-table-columns td
{
padding:0 5px 0 0; /* Only right padding*/
}

HTML:

<table className="padding-table-columns">
<tr>
<td>Cell one</td>
<!-- There will be a 5px space here-->
<td>Cell two</td>
<!-- There will be an invisible 5px space here-->
</tr>
</table>

小开

这可以通过使用 CSS 为列填充中间来实现。可以在除第一列外的所有列的左侧添加空白，也可以在除最后一列外的所有列的右侧添加空白。您应该避免将填充添加到最后一列的右侧或第一列的左侧，因为这将插入多余的空白。您还应该避免对类的规定性太强，以至于无法指定哪些列应该具有额外的填充，因为如果以后添加新列，这将使维护更加困难。

“ 前脑叶白质切除猫头鹰选择器”允许你选择所有的兄弟姐妹，不管他们是 th、 td还是其他什么。

tr > * + * {
padding-left: 4em;
}

<table>
<thead>
<tr>
<th>Column 1</th>
<th>Column 2</th>
<th>Column 3</th>
</tr>
</thead>
<tbody>
<tr>
<td>Data 1</td>
<td>Data 2</td>
<td>Data 3</td>
</tr>
</tbody>
</table>