HTML5设置视口（viewport）防止移动浏览器自动缩放页面

1，视口（viewport）的介绍

“视口”这个概念最早是苹果公司推出iPhone的时候发明的，为的使让iPhone的小屏幕尽可能完整显示网站。不管网站页面原始的分辨率尺寸多大，都能将其缩小显示在手机浏览器上，这样保证网页在手机上看起来更像在桌面浏览器中的样子。
在苹果引入视口的概念后，所有的移动开发者也都认同了这个做法。

2，修改视口设置，让浏览器不要自动执行视口缩放
在苹果推出视口概念的时候，当时的网站设计师还不知道什么是响应式设计。随着响应式设计概念的提出，要设计一个真正对移动设备友好的网站，那就得修改视口的设置。告诉浏览器不要自动执行视口缩放。
只需在页面的部分添加如下元素即可：

这行代码告诉移动浏览器使用真实的页面比例，不要缩放。

3，使用在线模拟器，查看网站在不同移动设备的样子

http://MobileTest.me 可以让我们在线查看比较网站在不同的移动设备上的外观（比如iPhone、iPad或其他的Android设备）。
注意：模拟器不支持缩放，其预览网站时，网站就会像你在标签中同上面第2点似的把初始比例设置为1的效果一样