CSS-媒体查询

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

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

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

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

<link rel="stylesheet" href="test.css" media="min-width:640px" />

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

• 媒体查询中的媒体类型