1. 作用
实现响应式布局 响应式局部：写一次样式兼容所有终端
2. 响应式布局优缺点
优点 面对不同分辨率设备灵活性强
缺点 代码累赘，会出现隐藏无用的元素，加载时间加长
3. 语法
内部引入：
移动端
@media screen and (max-width:768px){ }
ipad端
@media screen and (min-width:768px) and (max-width:992px){ }
PC端
@media screen and (min-widht:992px){ }
外部引入
移动端
<link href="" rel="stylesheet" media="screen and (max-width:768px)"/>
ipad端
<link href="' rel="stylesheet" media="screen and (max-width:992px) and (min-width:768px)"/>
pc端
<link href="" rel="stylesheet" media="screen and (min-width:992px)"/>
