使DIV最大高度等于"窗口高度 - 100px"

Question

有一种方法来设置max-height的%,但这里的任何方式来设置DIV最大高度,所以这将是比100像素窗口高度较小,只有CSS？

它不能是固定的布局,用户必须能够垂直滚动页面,但DIV应始终调整大小window height - 100px.这可能,或者我必须使用JS吗？

Answer 1

是:

#specificElement {
    height: calc(100vh - 100px);
    box-sizing: border-box;
}

这将使用CSS calc()功能减去100px从 100vh(1vh作为视图端口的高度的百分之一),并使用其结果作为值height属性.

的box-sizing力的浏览器包括padding,和borderS,在所计算出的height元件的.

显然,为您的用例使用相关的选择器.

参考文献:

• calc().
• CSS长度.