iOS与安卓浏览器都基于webkit核心，他们支持使用viewport meta元素覆盖原有画布缩放设置。只需要在html<head>标签中插入一个<meta>标签。标签中设置其具体宽度或者缩放比例如2.0（设备实际尺寸的两倍）。下面是实际尺寸放大设备的两倍的示例代码。
复制
<html> <head> <meta name="viewport" content="initial-scale=2.0,width=device-width"/> <title>代码狗示例代码</title> </head> <body> 网页内容.............................. </body> </html>
这里没有放大的原因是因为我是用的QQ浏览器，它是用的chrome内核，想要体验效果需要安卓或者iOS系统，我这里不方便启动虚拟机，想要看效果的自己用手机看吧。
有了缩放，肯定有禁止缩放，相对于缩放，禁止缩放的使用更加频繁，实现代码也很简单，只需将viewport属性修改成以下代码即可：
复制
<meta name="viewport" content="initial-scale=1.0,user-scalable=no"/>
上面initial-scale=1.0指明缩放比例为1.0即不缩放。user-scalable=no，的意思是说禁止缩放。
评论 （1）