CSS——viewport视口及设置

一、viewport视口
　　在移动端，viewport视口就是浏览器显示页面内容的屏幕区域。
　　viewport视口有两种视口，分别是 visual viewport(可视视口)和layout viewport(布局视口)：
　　　　（1）visual viewport固定大小跟屏幕大小相同，在上面；
　　　　（2）layout viewport可改变大小，在下面。layout viewport默认大小为980像素，可通过document.documentElement.clientWidth获取
　　现代网页需要把layout viewport设置成visual viewport同等大小，方便网页制作。
二、viewport设置
　　通过meta标签进行设置，name属性指定viewport值，content属性进行视口配置
　　<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no" />
　　取值：
　　　　width 　　　　 设置layout viewport宽度的特定值，device-width表示设备宽。
　　　　height 　　　　　　 设置layout viewport高度特定值，一般不进行设置。
　　　　initial-scale 　　　　 　　　　设置页面的初始缩放
　　　　minimum-scale 　　　　　　  设置页面的最小缩放
　　　　maximum-scale 　　　　 　　设置页面的最大缩放
　　　　user-scalable 　　　　 　　  设置页面能否进行缩放