CSS-媒体查询

移动设备的屏幕分辨率千差万别，为了获得更好的用户体验，需要根据不同的分辨率去呈现不同的界面。媒体查询就是目前的解决方案。

• 在CSS文件中定义媒体查询

@media screen and (min-width: 640px) {
    .container{
        padding:10px;
    }
}

• 在link标签中定义媒体查询

在这种情况下，test.css始终都会被引入，但是其中的规则是否生效，则取决于媒体查询条件。

• 媒体查询中的媒体类型

值	描述
all	所有设备
print	打印机或者打印预览
screen	电脑，平板，手机等屏幕
speech	屏幕阅读器等发声设备