javascript - CSS 表格高度

Question

我在 CSS 中执行以下操作时遇到问题(我想避免在页面就绪时使用额外的 javascript): 我有一个 100 行的表，它的大小比窗口大。 我想让表格高度 = winodw 高度，这样我就可以在表格上插入一个滚动条。这样做的原因是我必须在表格周围“导航”div(上下)，我希望在滚动时可见。如果我将容器的高度设置为精确的像素，但使用 %，它会完美地工作，只会在页面上生成带有滚动条的表格。是否可以在没有 javascript 的情况下在 CSS 中执行此操作？

所以我当前的表格 css:

#mainTable{
    width: 100%;
    height: 100%;
    overflow: auto;
    display: block;
}

问题是，如果窗口是 800px，这不会给出与我执行 height=800px 时相同的结果，因为使用 % 可以在页面上滚动，使用 px 可以得到 table 上的卷轴。

Answer 1

var parameter_one = "http: //one.css";  //your css for table
var parameter_two = "http: //two.css"   //your css w/o table

if (window.height < somevalue) {
    load_me(parameter_one)
} else {
    load_me(parameter_two)
}

function load_me(file) {
    var head = document.getElementsByTagName('head')[0];
    var link = document.createElement('link');
    link.rel = 'stylesheet';
    link.type = 'text/css';
    link.href = file;
    link.media = 'all';
    head.appendChild(link);
}