viewport（视口）

viewport 就是浏览器显示页面内容的屏幕区域，可以分为布局视口、视觉视口和理想接口。

1. layout viewport，默认视口
2. visual viewport，当前可以看到的区域
3. ideal viewport，理想的视口尺寸

视口标签的主要目的是让布局视口的宽度和理想视口的宽度一致

视口标签

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no,maximum=1.0,minimum=1.0">
<!--
width：viewport 宽度，可以设置为 device-width 特殊值
initial-scale：初始缩放比
maximum-scale：最大缩放比
minium-scale：最小缩放比
user-scalable：视口可以缩放
-->

标准的 viewport 参数

1. 视口宽度和设备保持一致
2. 视口默认缩放比为1.0
3. 不允许用户缩放
4. 最大缩放比为1.0

5. 最小缩放比为1.0

   倍图

   一个 Css 像素能显示的物理像素点的个数，成为物理像素比或屏幕像素比。

   移动端技术选型

6. 单独制作移动端页面

   1. 流式布局
   2. flex 布局
   3. less + rem + 媒体查询
   4. 混合布局
7. 响应使页面兼容移动端
   1. 媒体查询
   2. bootstrap