html - 在 HTML 中设置表格的高度没有效果

Question

为什么这个桌子高度不起作用？

<table border=1 bgcolor="green" width=80% height="30%">
    <tr>
        <td rowspan="2" >
            This is 1st row 1st column
        </td>
        <td >
            2
        </td>
    </tr>
</table>

http://jsfiddle.net/zQNS4/

Answer 1

只需将以下内容添加到您的 CSS 中：

html, body{
    height: 100%;
}

正如其他人所说， atable没有height-attriute，但大多数浏览器无论如何都会暗示这一点。你可以在 jsfiddle 上看到结果。

您需要这样做的原因是任何应该具有 % 高度的父元素也必须具有高度（正如影子向导所说：“确切地说是什么的 30%？” - 父元素必须具有高度）。

Answer 2

table标签不包含height属性。尝试使用 CSS 样式设置表格的高度。

table{
   height: 30%;
}

Answer 3

<div style="height: 200px; overflow-y: scroll;">
    <table border=1 bgcolor="green">
        <tr>
            <td rowspan="2" >
                This is 1st row 1st column
            </td>
            <td>
                 2
            </td>
        </tr>
   </table>
</div>

Answer 4

我只是有同样的问题。我在容器（ div config-table）中有桌子，只是设置height对我不起作用。我必须设置overflow: auto（因为我的情况auto需要），现在开始工作

.config-table {
   height: 350px;
   overflow: auto;
}