html - 表格行边框问题 - 需要一些填充或边距(左侧和右侧)

Question

点击链接http://jsfiddle.net/anglimass/njAFp/

我想要左右边框留一些空间:

现在:

想要:

请看“想要的图片”左​​右两边。我点击了“表格行”填充(左和右)。有人知道怎么做吗？

Answer 1

我不认为你可以在 TR 级别上做到这一点。 TD水平如何:

table tbody tr td {
    border-top: 1px solid red;
    border-bottom: 1px solid red;
}

table tr td:first-child {
    padding-left: 20px;
    border-left: 10px solid red;
}

table tr td:last-child,
td.last-td {
    padding-left: 20px;
    border-right: 10px solid red;
}

这在 x 浏览器兼容性方面也很重要。

编辑:您可以将上面的内容放到您的 fiddle 中并在 ie7 中查看它，将“hacky”“last-td”选择器添加到您的最后一个 TD(ie7 不支持“last-child”，但支持“first” - child ')