什么是媒体查询
媒体查询可以根据不同的显示设备以及特性（如视口宽度、屏幕比例、设备方向：横向或纵向）来为页面设定特定的css样式
如何引入媒体查询
1.在<head>中直接添加
<head>
<style>
@media 媒体类型1，媒体类型2 and(查询条件1) and(查询条件2)
{
选择器1{
相应样式
}
选择器2{
相应样式
}
...
}
</style>
</head>
2.通过<link>引入媒体查询
<link rel="stylesheet" media="媒体类型 and (查询条件)" href="widescreen-styles.css" />
3.常用媒体类型
all 、screen、 print
4.常用查询条件（使用时注意代码顺序和优先级）
min-device-width: 300px 、max-device-width: 480px
5.通过<link>引入的css文件始终会下载，但只在查询条件满足时生效。并且不同的css文件之间是并存关系
