媒体查询

媒体查询
@media 查询规则{}
all 所有设备
print 打印设备
screen 带屏幕设备
speech 屏幕阅读器

       可用，隔开多个类型表示或
       可加only表示唯一，为了兼容老版本浏览器

 @media screen,print {
            body{
                background-color:#bfa;
            }
         }

         @media only screen {
            body{
                background-color:#bfa;
            }
         }

媒体特性
width 视口宽度
height 视口高度
min-width 最小宽度（视口宽度>最小宽度时生效）
max-width 最大宽度（视口宽度>最大宽度时生效）

常用的断点
小于768 超小屏幕
大于768 小屏幕
大于992 中型屏幕
大于1200 大屏幕

@media screen and (min-width:300px) and (max-width:400px) {
            body{
                background-color:#bfa;
            }
         }