Question

我正在试图找出为什么我的表格单元格没有在我指定的高度显示：

<html>

<head>

</head>

<body>
<table style="border: 1px solid black; border-radius: 10px; padding: 0px;padding-top: 6px; margin: 0px;" align="left" bgcolor="#FFFFFF" border="1" cellpadding="0" cellspacing="0" height="842" width="595">
<tbody>
<tr><td height="100">Test</td></tr>
<tr><td height="100">Test</td></tr>
</tbody>
</table>
</body>

</html>

在我的浏览器（Firefox）上，此页面显示每个单元格占据表格高度的50％（覆盖整个表格），而不是每个单元格指定的100px。我已经尝试了每个组合，设置tr高度（实际上不存在），以及我发布的td高度。

我需要避免使用CSS，因为我正在为电子邮件生成HTML，而电子邮件客户端对CSS不是很宽容。我希望尽可能使用HTML标记属性设置我的表格。

修改

现在我真的很困惑。即使使用CSS设置高度也不起作用：

<table style="border: 1px solid black; border-radius: 10px; padding: 0px;padding-top: 6px; margin: 0px;" align="left" bgcolor="#FFFFFF" border="1" cellpadding="0" cellspacing="0" height="842" width="595">
<tbody>
<tr><td style="height: 100px;">Test</td></tr>
<tr><td style="height: 100px;">Test</td></tr>
</tbody>
</table>

修改

有人在评论中发布了一个JSFiddle，说它有效。但这是我的浏览器（Firefox）上的小提琴的屏幕截图： enter image description here

我想现在的问题是为什么我不能在Firefox上设置行高？

Answer 1

刚想通了。在Firefox上，您必须在CSS中设置display: block;，否则将不会应用表格高度：

<body>
<table style="border: 1px solid black; border-radius: 10px; padding: 0px;padding-top: 6px; margin: 0px; display: block;" align="left" bgcolor="#FFFFFF" border="1" cellpadding="0" cellspacing="0" height="842" width="595">
<tbody>
<tr><td height="100" style="display: block">Test</td></tr>
<tr><td height="100" style="display: block">Test</td></tr>
</tbody>
</table>
</body>

在Firefox中未应用TD高度

1 个答案: