html表格固定高度？

Question

我有一个表，它动态地显示来自数据库的记录。我只需要固定表格的高度，这样如果表格中有大量的行，表格就会在表格中向下滚动窗口。这样用户就不需要滚动整个页面了吗？

这有没有可能...？

先谢谢你...

Answer 1

一种解决方案是在样式周围使用<div>样式，其中使用<table>属性和：overflow: auto; max-height: (whatever height you want here)

举个例子：

<div id="mainHolder" style="overflow: auto; max-height: 400px;">
    <table>
    ... Lots of data ...
    </table>
</div>

这将创建一个高度可以增长的表，但它会被限制在div-layer中，并且当内容增长超过400px时，您将自动获得滚动条。

使用jQuery，您还可以执行以下操作：

<script type="text/javascript">
window.onresize = doResize;

function doResize() {
    var h = (typeof window.innerHeight != 'undefined' ? window.innerHeight : document.documentElement.clientHeight) - 20;
    $('#mainHolder').css('max-height', h);
    $('#mainHolder').css('height', h);
};

$(document).ready(function () { doResize(); });
</script>