html - 使 div 适合屏幕

Question

我有两个 div:

<div class="header">
</div>
<div class="scroll">
</div>

“header”是固定大小(40px)的栏，“scroll”是侧边栏，带有滚动条。我想让“滚动”填充“标题”和屏幕底部之间的所有可用高度。但是，如果我在“滚动”上设置 100% 或 100vh 高度，它会填满高度，但还会多占用 40px，这不适合屏幕，所以滚动条也会出现在浏览器上，即使 div“滚动”有自己的滚动条。

Answer 1

如果您愿意，可以使用 CSS3 calc .

width: calc(100% - 40px);

但请注意，并非所有浏览器都支持此功能(目前)。
参见 http://caniuse.com/calc查看浏览器对 calc 的支持。