单位：
-
一般使用em、rem或百分比
-
一般不用px，因为他是固定单位不好适配
视口
布局视口：
- 布局视口是指网页的宽度，一般移动端浏览器都默认设置了布局视口的宽度
视觉视口：
- 视觉视口决定用户可以看到的页面大小所包含的css像素
- 不同设备的默认视口宽度不一样
- 苹果系列的默认视口宽度一般是980宽度
name=viewport
- 开启视口样式
content
- width=device-width：设置视口宽度等于页面宽度
- initial-scale：视口的缩放比
不配置视口时默认计算是，缩放比=设备宽度/视口宽度
maximum-scale：设置最大的缩放比
- 数字设置，设置后最大不能超过设置的最大缩放比，超过就按最大缩放比来
minimum-scale：设置最小的缩放比
- 数字设置，设置后最小不能小于设置的最小缩放比，小于就按最小缩放比来
user-scale：设置是否允许用户缩放
- 使用yes/no 或 1/0来设置
产生的问题
css中的px ！=设备显示的px
单位
- vw：视口的宽度，0-100（相当于百分比）
- vh：视口的高度，0-100（相当于百分比）
媒体查询
- 媒体：手机/平板/电脑屏幕和打印机
- 作业：当宽度达到一定范围时，发生样式变化
- 写法@media 媒体/all（所有媒体）
关键字
- and——并且
- not——非
- only——（基本不用）
- 媒体查询的特点
- width：宽度
- min-width：最小宽度
- max-width：最大宽度
虎哥小知识
修改了header要重新运行浏览器刷新没用
赵三金你不愧是掘金码男，这一小知识，差点给我代码整报错
