背景
在调整一个移动端的页面，测试过程中发现在苹果IOS系统的浏览器中缩放异常，其实页面操作上来讲是不需要当前页面缩放的。所以，就需要禁止当前页面的缩放操作。经过确认，可以使用以下代码实现禁止缩放操作。
<meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">Viewport
| 属性名 | 取值 | 描述 |
width | 正整数或device-width | 定义视口的宽度，单位为像素 |
height | 正整数或device-height | 定义视口的高度，单位为像素，一般不用 |
initial-scale | [0.0-10.0] | 定义初始缩放值 |
minimum-scale | [0.0-10.0] | 定义放大最大比例，它必须小于或等于maximum-scale设置 |
maximum-scale | [0.0-10.0] | 定义缩小最小比例，它必须大于或等于minimum-scale设置 |
user-scalable | yes / no | 定义是否允许用户手动缩放页面，默认值 yes |
注意
viewport标签只对移动端浏览器有效，对PC端浏览器是无效的- 当缩放比例为
100%时，dip宽度 =CSS像素宽度 = 理想视口的宽度 = 布局视口的宽度 - 单独设置
initial-scale或width都会有兼容性问题，所以设置布局视口为理想视口的最佳方法是同时设置这两个属性 - 即使设置了
user-scalable = no，在Android Chrome浏览器中也可以强制启用手动缩放
支付宝扫码打赏
微信打赏
