我想知道如何计算vh
和vw
的值。我正在设计一个网站,使用2vw
和它的工作为我的文本完美。然而,我只是猜测。请告诉我这些单元是如何工作的,这样我以后就可以使用它们了。我还想知道他们是否有跨浏览器支持。
vw
和vh
分别是窗口宽度和高度的一个百分比:100vw是宽度的100%,80vw是80%等。
要计算以像素为单位的值,只需执行如下操作
vwToPx = function(vwValue) {
return $(window).outerWidth()/100*vwValue;
}
您应该注意的一件事是,mobile Safari仍然错误地呈现vh
,除了最新的Android浏览器之外,任何其他浏览器都无法处理这两个单元。参见Caniuse。
有关更多信息,您可以查看csstricks.com上的这篇文章。