媒体查询

语法：

@media logic type and (feature:value)###

media="logic type and (feature:value)"

logic:only或not；only关键字可以确保旧的浏览器不读取余下的媒体查询，同时一并忽略链接的样式表；not关键字可以对媒体查询的结构求反，让其反面为真；
type:类型，screen、print等；
feature:value对是可选的，但一旦使用必须用括号包围且前面有and；
媒体特性：
width
height
device-width
device-height
orientation
aspect-ratio（宽高比）
device-aspect-ratio（设备宽高比）
color
color-index（颜色数）
monochrome（单色）
resolution（分辨率）
scan（扫描）
grid（栅格）
例子:
<link rel="stylesheet" type="text/css" href="link.css" media="only screen and (max-width:480px)" />

@media screen and (min-width: 480px){
            body{
                background: blue;
            }
        }