控制移动端页面的缩放

最近用vue和mint-ui框架开发了一个微信公众号,部署以后,进入页面,发现页面会随着手指的滑动而缩放,查阅资料后发现要在index.html中设置一下。

以下是解决方法:

  vue生成的index.html页面中,meta标签是这样子的:

    <meta name="viewport" content="width=device-width">
 
  这里只要把meta标签改成以下内容,就可以控制页面的缩放
 
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0, user-scalable=0">
 
  具体属性值分析:
    width=device-width     使用设备的宽度来解析
    initial-scale=1.0          页面初始倍数为1倍

    maximum-scale=1.0   页面可放大的倍数为1倍

    minimum-scale=1.0   页面可缩小的倍数为1倍

    user-scalable=0         禁止用户缩放页面

posted @ 2018-08-09 17:12  原来是八戒啊  阅读(4030)  评论(0编辑  收藏  举报