CSS和HTML表格 - 间距/填充/边框问题（不知道是哪个）

我对此很新，我试图寻找一个回答它的帖子，但是我发现的每一个建议似乎都没有无论效果如何。CSS和HTML表格 - 间距/填充/边框问题（不知道是哪个）

基本上我有一个HTML表格 - 2行，第一行只有一个单元格（标题），第二行有3个单元格。我希望这是一个细边框行2

标题

1三个细胞中分离| 2 | 3

就像那样。我基本上已经知道了，但是2号在它剩下的线上是齐平的，我想要一些间距。

我已经试过：

CELLSPACING：10px的（在td标签）
右边框填充：10px的
边界间距：10px的

似乎都不是一个我想...

我手动调整了单元格的宽度，顶部是600px，下面的三个是每个200px。

任何想法？

来源

2013-06-30 user2536206

莫非你设置的jsfiddle与现有代码？ – sinisake

为什么你（很可能）使用表格进行布局，而不是在CSS中使用display：table和table-cell？ – FelipeAls

您可以使用选择器来选择文本对齐&绘制td边框。像

<table class=foo> 
    <tr><th colspan=3>Heading 
    <tr><td>1<td>2<td>3 
</table>

http://jsfiddle.net/A85rn/

tr td {text-align:center;border-left:solid;border-right:solid;width:2em;} 
tr td:first-of-type {text-align:left;border:none} 
tr td:last-of-type {text-align:right;border:none;}

来源

2013-06-30 10:04:36

我假设标记要设置边框，你可以在头两个td元素设置右边框。要设置边框和单元格内容之间的间距，请在td元素上设置水平填充;设置左右填充（对称）似乎很自然，但您可以根据需要调整它。例如样式表：

.foo td { 
    padding: 0 0.3em; 
    border-right: solid 1px; 
} 
.foo td:last-child { 
    border-right: none; 
}

jsfiddle

来源

2013-06-30 10:49:34

CSS和HTML表格 - 间距/填充/边框问题（不知道是哪个）

回答

相关问题