从屏幕大小的网站上获取缺失的高度

Question

网站结构如下：

1）Topbar

2）导航栏

3）画布适合缺少的屏幕尺寸

4）底栏

我的问题如下：我怎样才能获得画布缺少的屏幕大小，例如用户打开网站，topbar得到height css属性，其中包含：46px，导航栏获得了{ {1}} 46px和底栏：46px。

我如何从100％获得缺失的屏幕尺寸以适应整个缺失的屏幕，继承人截图：

红色标记区域是我需要填充屏幕的缺失尺寸。

我希望有人可以帮助我。

Answer 1

我认为你要找的是vh它是视图高度。

像.contents{width: 100%; height: calc(100vh - 92px)}

这样的东西

参见示例https://jsfiddle.net/sxh0n7d1/49/

在您为页眉和页脚减去100%后，这会将div设置为剩余页面的92px。