桌子内的图像下方总是有一点空间答案

【问题标题】：There is always a little space under images inside a table桌子内的图像下方总是有一点空间
【发布时间】：2013-01-31 22:29:39
【问题描述】：

我会为想要现场观看的人提供直接链接。

只需将鼠标悬停在其中一个表格列表中，您就会看到图像下方总是有一个小空间。我尝试过填充、边距、搜索 stackoverflow 并使用边框间距、边框折叠等，但到目前为止没有任何帮助。

我需要你的帮助。有什么问题，我错过了什么？

【问题讨论】：

标签： css

【解决方案1】：

问题实际上不是表格，img 标签是内联元素，默认情况下具有底部间距（我猜是行高，不知道为什么）。

解决方案：div.browseBuilds tr.browseBuilds_piece img { display: block; }

【讨论】：

【解决方案2】：

将 display: 块添加到 img。

    .browseBuilds_piece img{
       display:block
     }

【讨论】：

【解决方案3】：

见this similar question。因为img 是一个内联元素，所以HTML 源代码中img 标记周围的空格很重要并且将被显示。从代码中删除空格

<td style="vertical-align: middle;"><img src="./themes/default/images/builds/eski.jpg"></td>

或将img 显示为块元素，如Michal has pointed out。

【讨论】：

我认为 vertical-align: middle 是删除空格的好属性。 text-align: center 在我使用 display: block 时不工作

【解决方案4】：

用户 cellpadding="0" 和 cellspacing="0" 作为表格属性。

<table border="0" cellpadding="0" cellspacing="0" >

【讨论】：

【解决方案5】：

问题可能是单元格间距和单元格填充，但我不确定......这个东西的真正好工具是萤火虫，检查元素你会看到所有使用的样式等......或者尝试像你的 img 一样在 50px 上修复 td 高度

【讨论】：