Question

<table id="first"style="width:310px;border:2px;margin-top:10px;margin-left:auto;margin-right:auto;background:#F7F7F7;">
<tr>
    <td style="height:50px;width:100%;"></td>
</tr>
<tr><td>
    <table style="width:100%;">
    <tr>
    <td id="_1"style="background:#FF70C6;width:151px;height:20px;cursor:pointer;">Low/empty</td>
    <td id="_5"style="background:#FF5053;width:151px;height:20px;cursor:pointer;">Unusable</td>
    </tr>
    <tr>
    <td id="_2"style="background:#0099FF;width:151px;height:20px;cursor:pointer;">Unclean</td>
    <td id="_5"style="background:#FF5053;width:151px;height:20px;cursor:pointer;">Unusable</td>
    </tr>
    <tr>
    <td id="_3"style="background:#00D07B;width:151px;height:20px;cursor:pointer;">Damaged</td>
    <td id="_5"style="background:#FF5053;width:151px;height:20px;cursor:pointer;">Unusable</td>
    </tr>
    <tr>
    <td id="_4"style="background:#FF5053;width:151px;height:20px;cursor:pointer;">Unusable</td>
    <td id="_5"style="background:#FF5053;width:151px;height:20px;cursor:pointer;">Unusable</td>
    </tr>
    <tr>
    <td id="_5"style="background:#FF5053;width:151px;height:20px;cursor:pointer;">Unusable</td>
    <td id="_5"style="background:#FF5053;width:151px;height:20px;cursor:pointer;">Unusable</td>
    </tr>
    </table>
</td></tr>
<tr><td id="ad"style="background:url('R/ad.png');width:100%;height:113px;cursor:pointer;"></td></tr>
<tr><td style="height:20px;width:100%;text-align:right;">text</td></tr>

我在<td>内有一张桌子。父<td>具有某种单元格间距/填充边框的功能，它可以轻微地推动子表（顶部，左侧，右侧，底部）。

虽然每个方向只有2个像素，但是当我看到它的时候，我从我的眼球（猛烈地）呕吐，因为我在下面的<td>下面有一个图像，子表的细胞外壁应该是同花顺。有没有人知道桌面的CSS，因为我没有发现w3scools / css-tricks非常有用（或者可能是因为我无法正确形成一个有用的连贯查询字符串供谷歌搜索）？

Answer 1

几个选项：

CSS：border-collapse: collapse（fiddle）
过时的表格属性：cellpadding = 0和cellspacing = 0（fiddle）。

表内被每侧压扁2px

1 个答案: