增加表格行数答案

【问题标题】：increase rows of table增加表格行数
【发布时间】：2011-03-16 08:10:50
【问题描述】：

<table>
    <tr>
      <td>//1
        //some control server side  
      </td>
    </tr>
    <tr>
        <td>//2
            //some control server side
        </td>
    </tr>
    <tr>
        <td>//3
           //some control server side
        </td>
    </tr>
</table>

我喜欢增加 td.1 的 hegiht 内容，然后自动增加 td.2 和 td.3 的 hegiht。

【问题讨论】：

你能把你的问题说清楚一点吗？很难理解你想要什么。
我认为 OP 想要“当 TD 1s 高度增加时，TD 2 和 3 同时增加。”虽然我可能弄错了，
@GodIsLive：你确定你的意思是 height 而不是 width？既然是表格，那么高度的增加应该是自动发生的……如果你想让每个表格单元格的内容对齐，那么使用<td valign="top">或<td style="vertical-align: top">（样式设置可以移到一个类中）
请澄清您的问题，否则将因模棱两可而关闭

标签： html css stylesheet

【解决方案1】：

您可以使用 CSS 轻松做到这一点。

<table>
  <tr>
    <td class="cell-class"> cell 1 </td>
  </tr>
  <tr>
    <td class="cell-class"> cell 2 </td>
  </tr>
  <tr>
    <td class="cell-class"> cell 3 </td>
  </tr>
</table>

在您的 .css 文件中，执行以下操作：

.cell-class { height: 40px; }

当你在css中增加高度时，三个单元格会自动增加高度。

【讨论】：

【解决方案2】：

增加所有单元格高度的更简洁（更快）的方法是：

HTML

<table id="my_table">
    <tr>
        <td> cell 1 </td>
    </tr>
    <tr>
        <td> cell 1 </td>
    </tr>
    <tr>
        <td> cell 1 </td>
    </tr>
</table>

CSS

#my_table tr td
{
  height: 40px;
}

【讨论】：

回过头来看，在 td 中添加 padding 会更好（从内容的角度）： padding: 15px 0;.