0

我对此很陌生,我试图搜索一个回答它的帖子,但我发现的每一个建议似乎都没有任何效果。

基本上我有一个 HTML 表格 - 2 行,第一行只有一个单元格(一个标题),第二行有 3 个单元格。我希望有一个细边框分隔第 2 行中的三个单元格


标题

1 | 2 | 3


像那样。我基本上得到了它,但是 2 与左边的线齐平,我想要一些间距。

我试过了:

cellspacing:10px(在 td 标签中)
border-right-padding:10px
border-spacing:10px

似乎没有一个是我想要的...

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

有任何想法吗?

4

2 回答 2

1

您可以使用选择器来选择文本对齐和绘制 td 边框。 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-30T10:04:36.993 回答
0

我假设标记像

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

要设置边框,您可以在前两个td元素上设置右边框。要设置边框和单元格内容之间的间距,请在td元素上设置水平填充;设置左右填充(对称)似乎很自然,但您可以根据需要进行调整。示例样式表:

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

jsfiddle

于 2013-06-30T10:49:34.950 回答