移动端适配 - HTML meta viewport属性说明

利用meta标签对viewport进行控制

   　 移动设备默认的viewport是layout viewport，但在进行移动设备网站的开发时，我们需要的是ideal viewport。这就使用meta标签来设置移动端显示的比例。
　　我们在开发移动设备的网站时，最常见的的一个动作就是把下面这个东西复制到我们的head标签中：

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

　　该meta标签的作用是让当前viewport的宽度等于设备的宽度，同时不允许用户手动缩放。如果在进行移动端开发时不这样的设定的话，那就会使用那个比屏幕宽的默认viewport，网站在手机端显示时会出现横向滚动条。
        meta viewport 标签首先是由苹果公司在其safari浏览器中引入的，目的就是解决移动设备的viewport问题。后来安卓以及各大浏览器厂商也都纷纷效仿，引入对meta viewport的支持，事实也证明这个东西还是非常有用的。

meta viewport 的属性

在苹果的规范中，meta viewport 有6个属性(暂且把content中的那些东西称为一个个属性和值)，如下：

width

设置layout viewport  的宽度