CSS3视窗单位vw、vh、vmin、vmax记录

vw:相对于视口的宽度。视口被均分为100单位的vw
vh:相对于视口的高度。视口被均分为100单位的vh
vmax:相对于视口的宽度或高度中较大的那个。其中最大的那个被均分为100单位的vmax
vmin:相对于视口的宽度或高度中较小的那个。其中最小的那个被均分为100单位的vmin
视窗,指的是浏览器可视区域的宽高,也就是window.innerWidth/window.innerHeight。1vw就是1%的浏览器的宽度。100vw就是整个视窗的宽度。

与%百分比的区别
% 是相对于父元素的大小设定的比率,vw 是视窗大小决定的。
其实这些视窗单位与%使用基本类似,优势在于能够直接获取高度,而用%在没有设置body高度的情况下,是无法正确获得可视区域的高度的,所以这是挺不错的优势。

css3参考手册:http://www.css88.com/book/css/values/length/vmin.htm
参考博客:http://blog.csdn.net/lecepin/article/details/54178095

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 大家好,我是IT修真院萌新分院的王寒,一枚正直,纯洁,善良的前端程序员。 1.背景介绍 传统的项目开发中,我们只会...
    傲慢的小寒哥阅读 8,651评论 0 0
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,696评论 1 92
  • 1、px px就是pixel的缩写,意为像素。px就是一张图片最小的一个点,一张位图就是千千万万的这样的点构成的,...
    jrg陈咪咪sunny阅读 6,778评论 0 0
  • 单位,在各个领域都是很常见的。那么在前端领域用到了哪些单位呢,这篇文章让我们细细了解一下! 下面我讲列举:pt、p...
    贵在随心阅读 11,100评论 0 7
  • 我是一个有着严重拖延症的患者。我的拖延症已经让我失去了宝贵的二十年青春。像我现在这个年龄,路遥已经完成了他的辉煌...
    平原柳阅读 2,271评论 0 3

友情链接更多精彩内容