移动端viewport讲解

viewport

viewport描述:
也就是可视区域。对于桌面浏览器，我们都很清楚viewport是什么，就是除去了所有工具栏、状态栏、滚动条等等之后用于
看网页的区域，这是真正有效的区域。由于移动设备屏幕宽度不同于传统web,因此我们需要改变viewport;这是真正有效的
区域。由于移动设备屏幕宽度不同于传统web,因此我们需要改变viewport

viewport属性

对于viewport我们可以操作的属性：
width -  viewport 的宽度 （范围从200 到10,000，默认为980 像素）
height -  viewport 的高度 （范围从223 到10,000）
initial-scale -  初始的缩放比例 （范围从>0 到10）
minimum-scale -  允许用户缩放到的最小比例
maximum-scale -  允许用户缩放到的最大比例
user-scalable -  用户是否可以手动缩放 (no,yes)
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
meta标签表示：
width=device-width ：表示宽度是设备屏幕的宽度
initial-scale=1.0：表示初始的缩放比例 
minimum-scale=1.0：表示最小的缩放比例 
maximum-scale=1.0：表示最大的缩放比例 
user-scalable=no：表示用户是否可以调整缩放比例