布局尺度单位介绍

布局分为以下三种:
1。layout viewport ,也就是这个浏览器默认的viewport
2。visual viewport  , 浏览器可视区域viewport
3。 ideal viewport  ,移动设备的理想viewport

1.px并不相通(适合pc设备)
2.rem并不相通(适合移动设备)
3.vh适用于两者之间(移动+PC)

设置viewport
 1 <meta name="viewport" content="width=device-width, initial-scale=1 user-scalable=0"> 
为了达到理想移动设备viewport,可以用meta标签对viewport进行控制
而meta标签内可以有很多的属性,具体如下
width    设置layout viewport  的宽度,为一个正整数,或字符串"width-device"
initial-scale    设置页面的初始缩放值,为一个数字,可以带小数
minimum-scale    允许用户的最小缩放值,为一个数字,可以带小数
maximum-scale    允许用户的最大缩放值,为一个数字,可以带小数
height    设置layout viewport  的高度,这个属性对我们并不重要,很少使用
user-scalable    是否允许用户进行缩放,值为"no"或"yes", no 代表不允许,yes代表允许

 

posted @ 2017-12-05 16:05  Sunsin  阅读(200)  评论(0编辑  收藏  举报