彻底完美解决安卓苹果手机点击输入框网页页面自动放大缩小

为了方便用户的查看浏览器在移动默认设置用户可以放大或者缩小，

但是随着前端届的日新月异的变化，反而随意放大缩小成了我们需要解决的问题；

 

安卓手机解决方案：

// 以下为注释

//在移动浏览器上页面渲染是在一个叫viewport的页面绘制区域内。
// 设置layout viewport 的宽度，为一个正整数，使用字符串”width-device”表示设备宽度
 content="width=device-width,

// 设置页面的初始缩放值，为一个数字，可以带小数
 initial-scale=1.0,

//允许用户的最小缩放值，为一个数字，可以带小数

 minimum-scale=1.0,

//允许用户的最大缩放值，为一个数字，可以带小数
 maximum-scale=1.0,

//是否允许用户进行缩放，值为”no”或”yes”, no 代表不允许，yes代表允许
user-scalable=no"/>

　

其实使用meta标签可以解决安卓手机的的放啊或者缩小的问题，但是meta标签在苹果手机上的作用却是 const meta = 0(哈哈，就是没有作用)苹果手机还有点击input输入框自动放大的功能，认为这样用户体验好。

 

其实不然，这也是我们煞费苦心需要解决，这时候使用meta=viewport,是没有效果的，我们网上千奇百怪的方法感觉都没有效果，这里向大家分享一下，终极干货，使用JS使IOS无法缩小放大；

 

IOS端：

 

希望大家使用有效果可以留言支持，或者请我喝杯咖啡~

 

很多坚持，是因为有肯定！