vmax

版本: CSS3

vmax:视口高度 vw 和宽度 vh 两者之间的最大值。

“视窗口区域”所指为浏览器内部的可视区域大小,即window.innerWidth/window.innerHeight大小,不包含任务栏标题栏以及底部工具栏的浏览器区域大小

浏览器支持

IE浏览器 火狐浏览器 opera浏览器 chrome浏览器 safari浏览器
IE10以上版本的浏览器都支持 vmax

说明:

相对于视窗口区域的宽度或高度中较大的那个。其中最大的那个被均分为100单位的vmax

示例代码:

h1{font-size: 8vmax;}

如果视窗口区域的宽度是300mm,高度是200mm,那么上述代码中h1元素的字号将为24mm,即(8x300)/100,因为宽度比高度要大,所以计算的时候相对于宽度。

<!DOCTYPE html>
<html lang="zh-cmn-hans">
<head>
<meta charset="utf-8"/>
<title></title>
<style>
p{
	font-size:5vmax;
}
</style>
</head>
<body>
	<p>相对于viewport的宽度或高度中较大的那个然后计算文字大小。</p>
</body>
</html>

效果图

上篇: vh

下篇: vmin