视口：就是浏览器显示页面内容的屏幕区域
视口分为：布局视口 视觉视口 理想视口
布局视口：
一般移动端设备的浏览器都默认设置了一个布局视口，为了解决早期pc端页面在移动端上的显示问题
苹果 安卓，基本上设置这个视口的分辨率980px
视觉视口：你看到的网页区域，指的是网址的区域
通过缩放去操作视觉视口不会影响布局视口
理想视口：
1.是网站在移动设备的浏览器中最理想的状态（浏览和阅读宽度设计的）
2.对设备来说是最理想的尺寸。
3．引入一个meta标签，通知浏览器进行对应的操作。
4.meta标签的主要目的就是为了使布局视口的宽度应与理想窗口的宽度一致。就是设备有多宽，布局视口就有多宽。
meta标签：
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
width=device-width当前的宽度与当前设备的宽度一致
initial-scale=1 初始的缩放比例（默认值为1）
minimum-scale=1允许用户缩放到的最小比例（默认值为1）
maximum-scale=1允许用户缩放到的最大比例（默认值为1）
user-scalable=no用户是否可以手动缩放（默认不允许）因为我们不希望用户去放大缩小页面。
注意：移动端必须写meta标签，且是禁止缩放。
作用：针对视口
视口缩放：在375px的设备中截图出来到ps中测量是750px在ps中的值比设备中的px值大一倍