H5中移动端设备的视口控制

当设计师在设计网页时，一般会按照一个固定的宽度设计，比如在PC端是1000px或者1200px，在移动端是640px或者750px。然而当这些网页在移动设备上浏览时会显示不完整，设备的宽度远远不够。拿IPhone6来说，其视口宽度是375px，完全满足不了网页需求。
为了弥补这一点，移动设备上浏览器会把视口放大，一般是980px或者1024px。但这样的后果是浏览器会出现横向滚动条，因为设备实际可视区域比浏览器自设的这个宽度要小很多，为了解决这个问题，就需要引入viewport属性。viewport属性通过一个meta标签引入，实际代码如下：

<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">