Question

这是我的代码，我已经将边框间距设置为零，但图像下面有一个奇怪的额外空间

  <table style="border-spacing:0px" width="100%" border="0" cellspacing="0" cellpadding="0">
        <tr>
            <td style="padding-left:20px">
                <p>Interviewing soon?</p>
            </td>
        </tr>
        <tr>
            <td style="padding-left:20px">
                <p>Interviewing soon? blab blaa</p>
            </td>
        </tr>
    </table>

Answer 1

你有填充底部：5px;据我所知，<td>元素。尝试将其设置为0px

Answer 2

如上面的海报所示，将padding属性设置为0px。

我认为你从某个地方复制了那个表而不知道html属性是做什么的，我是对的吗？

如果没有，我有一些建议要添加：

你应该安装并使用“Firebug”（Firefox或谷歌浏览器的插件），右击你的空间，“用firebug检查元素”，然后尝试用右边的css属性编辑器禁用不同的属性，直到你的空白消失，然后你知道你的代码需要改变什么。

Answer 3

只需在Steini的答案中添加一些内容：

以下是使用chrome内置Web检查器的有用指南。

https://developers.google.com/chrome-developer-tools/

这些工具对新用户来说非常难以接受，因此这可以帮助您熟悉UI并有效地开始使用其功能。

Answer 4

如果要实现固定单元格内容类型的布局，请执行以下css更改

{必须从td移除底部填充}

.fixCell td {  height:120px; display: inline-block;}

Fiddle Demo

HTML表格下方奇怪的额外空间

4 个答案: