vmax
版本:CSS3
“视窗口区域”所指为浏览器内部的可视区域大小,即window.innerWidth/window.innerHeight大小,不包含任务栏标题栏以及底部工具栏的浏览器区域大小
浏览器支持
![]() | ![]() | ![]() | ![]() | ![]() |
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>
效果图: