为了账号安全,请及时绑定邮箱和手机立即绑定

宽度vw和高度vh是怎么计算的

这个单位是怎么计算的,跟设计图的尺寸有关系吗,有的设计图是640的,还有的是750/1080的,都是怎么计算的啊,跟em,rem,%都有什么区别

正在回答

5 回答

当前环境下元素尺寸(像素)/当前设备分辨率宽度(像素)*100得出vm;

而vh就是相对于设备高度计算的啦


0 回复 有任何疑惑可以回复我~
音乐图片的大小是75X75 怎么算才等一 15vw和15vh


0 回复 有任何疑惑可以回复我~
#1

懵逼的我

当前环境下元素尺寸(像素)/当前设备分辨率宽度(像素)*100得出vm; 而vh就是相对于设备高度计算的啦
2016-12-22 回复 有任何疑惑可以回复我~

font-size: 1.5625vw;是怎么回事呢?这个1.5625 = (10/640)*100 ,这个10是怎么来的呢,为了开发方便大家都喜欢把根字体设为10px,因为这样的话1rem就等于10px,而我们在量设计图时得到的单位是px,所以我们在转成rem时直接除以10就可以,计算非常方便。这个640是一般的设计图都是640px宽的,这个值可以根据设计图的实际大小来调整。为什么要乘以100呢,因为要换算到vm的单位。

http://www.imooc.com/article/4767 文章一直在核审中,不知道你们能不能看到

2 回复 有任何疑惑可以回复我~

demo中,字号10像素,写的是15点多vw,如果用%的话是62.5%这是怎么回事啊

0 回复 有任何疑惑可以回复我~

px:绝对单位,页面按精确像素展示

em:相对单位,基准点为父节点字体的大小,如果自身定义了font-size按自身来计算(浏览器默认字体是16px),整个页面内1em不是一个固定的值。

rem:相对单位,可理解为”root em”, 相对根节点html的字体大小来计算,CSS3新加属性,chrome/firefox/IE9+支持。

vw:viewpoint width,视窗宽度,1vw等于视窗宽度的1%。
vh:viewpoint height,视窗高度,1vh等于视窗高度的1%。

0 回复 有任何疑惑可以回复我~
#1

丫丫_0006 提问者

demo中,字号10像素,写的是15点多vw,如果用%的话是62.5%这是怎么回事啊
2016-02-15 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
HTML5+CSS3实现春节贺卡
  • 参与学习       110056    人
  • 解答问题       450    个

又逢新春佳节,春节贺卡搞起来,学会HTML5+CSS3实现春节贺卡

进入课程

宽度vw和高度vh是怎么计算的

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信