关于meta name="viewport"详解

在手机网站建设中，我们经常会看到网页头的元标签中含有viewport。使用这样的标签，其作用是使手机浏览的时候按照一定的缩放比例以及一定的宽度来显示页面。下面我们详细解读一下viewport元标签的使用。

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

以上的语句是一句含有所有元素的viewport元标签，我们对每句话进行一个详细的解释：

1. width=device-width - 设置页面的宽度，device-width代表设备的屏幕宽度。width=device-width即宽度等于屏幕的宽度。同理也有height=device-height，一般很少用。
2. initial-scale - 页面初始化的缩放比例，1.0代表原始比例。如果使用2.0则代表双倍放大。
3. minimum-scale=1.0 - 用户允许缩小到的最小比例
4. maximum-scale=1.0 - 用户允许放大到的最大比例
5. user-scalable=no - 用户是否可以手动缩放。no为不可以，如果不加该语句，默认用户可以手动缩放。

在如今wap2.0的页面中，以上语句是必不可少的，这个对手机用户的用户体验度会有非常大的影响。