如何在 CSS 中控制表格的 tr 高度答案

【问题标题】：How to control tr height of table in CSS如何在 CSS 中控制表格的 tr 高度
【发布时间】：2011-10-06 06:40:25
【问题描述】：

我尝试减少表格中每个tr 之间的空白。

我设置了"table id='recTable' cellspacing=\"0\" cellpadding=\"0\""，这意味着每个tr之间没有空格（已确认）。所以我只需要降低tr 本身的高度。

我使用"height:40px;" 来执行此操作，但它不起作用，没有变化。

它总是显示70px height。但是如果我设置一个像"height:100px;"这样的大高度，高度超过70px，那么它会变成我设置的高度。

我该怎么做？

【问题讨论】：

stackoverflow.com/questions/2092696/how-to-fix-height-of-tr
投稿前请先搜索！

标签： css tablerow css-tables

【解决方案1】：

最好在 td 元素内部有一个 div 元素，并固定 div 元素的高度。它对我有用。

 <tr>
    <td>
       <div style="max-height:92px;">
         <span style="color: #992222; font-size:36pt;font-family:Arial Baltic;">
         "     </span>
       </div>
   </td>
 </tr>

【讨论】：

请问为什么这被否决了？在单元格内放置一个 div 的解决方案适用于许多人。如上所述，仅设置高度样式并不能阻止内容扩展 td（请参阅 Jason Gennaro 的小提琴）。

【解决方案2】：

你可以在你的 CSS 中明确地设置它。例如：

table#recTable{width:100%; border:1px solid red;}
#recTable tr td {height:40px; border:1px solid red;}

HTML

<table id="recTable">
    <tr><td>Something</td></tr>
    <tr><td>Something else</td></tr>
</table>

http://jsfiddle.net/jasongennaro/qXpLM/

例如边框

【讨论】：

【解决方案3】：

您需要在 TR 中设置 TD 或 TH 的高度或行高。

【讨论】：