vh/vw
vh:相对于窗口高度，窗口均划分为100个vh单位；
相对于vw:的窗口宽度，所有窗口被划分为100个vw单位；
vmax:相对于窗口的宽度或高度中较大的一个。 其中最大的都分为100个单位的vmax；
vmin:相对于窗口的宽度或高度中较小的一个。 其中最小的都分为100个单位的vmin；
视口是浏览器内部可见区域的大小。
也就是说，它的大小为window.inner width/window.innerheight，不包括任务栏标题栏和底部工具栏浏览器区域的大小。
calc
calc是英语calculate“计算”的缩写，是css3的新功能，用于指定元素的长度。 例如，要为元素的border、margin、pading、font-size和width等属性设置动态值，请使用calc ()。 为什么是动态值呢？ 从我们使用的公式中得到的值。 但是calc ) )的最大优点是用于流体布局，可以通过calc ) )计算得到元素的宽度。
calc是计算css3提供的css文件中值的函数。
用于动态计算长度值。 需要注意的是，必须在运算符前后留下空格。 例如，width:calc(100%-10px )； 长度值可以使用calc (函数计算。 calc ) )函数支持“、”-“、“*”、“/”运算； calc ) )函数使用标准的数学运算优先级规则； CALC(100VH-10px )表示整个浏览器窗口的高度减去10px的大小calc，而整个浏览器窗口的宽度减去10px的大小通常用于设置流布局的宽度高度。 当然，也可以在元素的border、margin、pading和foor中使用calc )
calc ()的兼容性如下，使用时需要注意。
在less中使用calc
11 2018-10-10 09:36:26 2270收藏1
专栏： less文章标签： less calc
版权
在less中，我们发现带单位的混合运算(如calc(100%-4rem ) )在less分析中忽略单位，并且全部按百分比计算。 此示例的计算由less编译为calc ) 96%。
解决方案
max-height : calc ((100 VH-69px )；
与less的使用特性组合
@postHeight: 46px；
@postBorderHeight: 1px；
@postMarginHeight: 10px；
毛利- bottom 3360 calc (~' @ { postheight } ) ) ) )。
margin-bottom3360calc(((@ ) postheight ) )3@ (post marginheight ) ) ) )。
提示：运算符(-*/)前后一定有空格，便于分析！
————————————————
这是CSDN博客“瑶11”的原创文章，符合CC 4.0 BY-SA版权合同。 请附上原文来源的链接和本声明。
原文链接： https://blog.csdn.net/weixin _ 40551876/article/details/82992003