视口： 移动端特有，有默认宽度980px，且有缩放功能，用来承载网页，浏览器承载视口，这个区域是虚拟的
pc：浏览器窗口 - 网页
移动：浏览器窗口 - 视口 - 网页
问题： 当设备宽度 < 网页宽度时（视口承载网页有默认狂赌默认缩放功能）导致网页内的内容缩放
解决：
做移动端适配：（标准移动端页面）
1. 视口的宽度要和设备一致，网页100%，网页宽度和视口宽度一致
2. 默认视口缩放比例和PC（网页预览效果）比例一致1.0
3. 不允许用户缩放页面
视口设置完成以上需求：
在<head>标签中添加<meta>
<meta name="viewport">：声明视口
content=""：设置属性
width：视口宽度
height：视口高度
initial-scale：视口默认缩放比例
user-scalable：是否允许用户自行缩放
maximum-scale=1.0：最大缩放比例（可默认不写）
minimum-scale=1.0：最小缩放比例
<meta name="viewport" content="width=device-width; initial-scale=1; user-scalable=no">