查漏补缺——说说calc(100vh - 80px)
作者:互联网
问题
如题所示
答案
vh,指的是Viewport height,也就是视窗的高度。而什么是视窗呢?
如下图所示,浏览器显示内容的部分,其中也包括滚动条,不包括地址栏、搜索栏、标签栏等:
相关源码:
#hzh-layout-body {
min-height: -moz-calc(100vh - 80px);
min-height: -webkit-calc(100vh - 80px);
min-height: calc(100vh - 80px);
}
那么这里的100vh代表的就是100%的视窗大小,减掉的80px就是header的大小。
而min-height: calc(100vh - 80px);
这个表示的是会动态计算视窗高度减去header的高度(80px)。
标签:查漏,视窗,vh,height,80px,100vh,calc 来源: https://www.cnblogs.com/Huang-zihan/p/16413075.html