如何大众和VH单元作品 [英] How does vw and vh unit works

查看:105
本文介绍了如何大众和VH单元作品的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

大众和VH单元的工作原理。我想知道如何为这个单位计算值。我设计一个网站,并使用2vw其完美的我的文字工作。不过,我只是做了一个猜想把这个值。请告诉我它是如何工作的,所以这将是更好地为我在今后的使用,它是跨浏览器。

How VW and VH unit works. I want to know how to calculate value for this unit. I am designing a website and uses 2vw and its working perfectly for my text. However i just a made a guess to put this value. Please tell me how it works, so it will be better for me to use in future and is it cross browser.

推荐答案

VW VH 是一个百分比窗口的宽度和高度,分别:100vw是宽度的100%,80vw为80%,等

vw and vh are a percentage of the window width and height, respectively: 100vw is 100% of the width, 80vw is 80%, etc.

要计算的像素值,你只想做类似

To calculate the value in pixels, you would just do something like

vwToPx = function(vwValue) {
    return $(window).outerWidth()/100*vwValue;
}

您应该知道的一件事是,移动Safari浏览器仍然呈现 VH 不正确,以及什么,但最新的Andr​​oid浏览器无法处理任何单位。请参见 caniuse

One thing you should be aware of is that mobile Safari still renders vh incorrectly, and anything but the most recent Android browser can't handle either unit. See caniuse.

有关详细信息,你可能看上csstricks这篇文章。 COM。

For more information, you might look at this article on csstricks.com.

这篇关于如何大众和VH单元作品的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆