h5适配pc和移动，meta标签的配置

h5兼容移动端，为了确保适当的绘制和触屏缩放，需要在meta标签之中添加viewport元数据标签

<meta name="viewport" content="width=device-width,initial-scale=1">    

viewport：视口，是浏览器显示页面内容的屏幕区域，视口可以分为布局视口（layout viewport）、视觉视口（visual viewport）和理想视口（ideal viewport）

设置meta标签主要是为了让我们布局的视口宽度和设备宽度保持一致。

如果业务需要禁止用户使用缩放功能，可以设置user-scalable=no,

<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1, minimum-scale=1.0,user-scalable=no,viewport-fit=cover" />

name="viewport",说明meta标签是用来设置viewport属性的，这个属性只有在移动端才会有效。

width="device-width"是为设备的宽度（单位缩放为100%时的css的像素）

initial-scale:初始缩放比例，当页面第一次load的时候缩放比例（设置scale=1，布局视口（layout viewport）和理想视口（ideal viewport）的大小相等

maximum-scale：允许用户缩放到的最大比例。

minimum-scale：允许用户缩放到的最小比例。

user-scalable:是否允许用户进行缩放，值为”no"或”yes"

 

有关于meta标签详细配置请参考https://www.jianshu.com/p/fa8f3959243d?utm_campaign=maleskine