希望这是一个简单的,但我还没有找到解决方案.我想在表格的列之间放置空格.
例
| Cell |<- space ->| Cell |<- space ->| Cell |
Run Code Online (Sandbox Code Playgroud)
重要的一点是我不希望边缘有空间.有一个border-spacing属性,但在IE(6或7)中不支持,所以这是不好的.它还在边缘放置空间.
我提出的最好的方法是将padded-right:10px放在我的表格单元格上,并在最后一个单元格中添加一个类来删除填充.这不太理想,因为额外的空间是细胞的一部分而不是它的外部.我想你可以用透明边框做同样的事情吗?
我也尝试过使用jQuery:
$(function() {
$("table > tbody > tr:not(:last-child").addClass("right-padding");
});
Run Code Online (Sandbox Code Playgroud)
但即使在只有大约100行的桌子上,在某些情况下这需要200-400ms,这太慢了.
任何帮助赞赏.
谢谢
对于那些暗示列不起作用的人.试试这个:
<html>
<head>
<title>Layout</title>
<style type="text/css">
table { border: 1px solid black; }
td { background: yellow; }
</style>
</head>
<body>
<table>
<col style="padding-right: 30px;">
<col style="padding-right: 30px;">
<col>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
<tr>
<td>7</td>
<td>8</td>
<td>9</td>
</tr>
</table>
</body>
</html>
Run Code Online (Sandbox Code Playgroud) 我想对下面写的表格进行设计.
<table border="1" cellspacing="10">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
Run Code Online (Sandbox Code Playgroud)
问题是cellspacing设置了细胞之间的空间和水平,我希望它只能在水平上完成.有没有办法做到这一点.