媒体查询
一般用法 在css文件中加入@media screen and(min-device-width:500px)and(max-device-width:700px){填写相应的布局}
其中两个括号里面表示对screen相应配置的限制 具体有 device-width表示设备宽度width:表示屏幕宽度
两种引用方式
方式1

image.png
方式2

image.png
flex布局
子属性

image.png
子属性的特殊写法

image.png
rem 表示根元素字体大小为单位

image.png