媒体查询

预定义的媒体类型：

1.screen：媒体样式表的写法：

<link rel="stylesheet" type="text/css" media="screen" href="sans-serif.css">

2.print：媒体样式表的写法：

<link rel="stylesheet" type="text/css" media="print" href="serif.css">

媒体查询的一个逻辑表达式，其结果为真（true）或假（false）。

媒体查询例子：

<--!应用于支持指定特性（彩色）的特殊媒体类型（‘screen’）-->
<link rel="stylesheet" media="screen and (color)" href="example.css">

<--!写在CSS的@import-rule语句中-->
@import url(color.css) screen and  (color);

2.适用于所有媒体类型的简写语法，关键字all和and可以省略：

@media (orientation:portrait){...}
@media all and (orientation:portrait){...}

3.满足特殊需求的复杂查询：

@media all and (max-698px) and (min-520px),(min-1150px){
    body{
        background:#ccc;
    }       
}

媒体特性：

1.width和device-width;

2.height和device-height;

3.orientation;

4.aspect-ratio和device-aspect-ratio;

5.color和color-index;

6.monochrome(如果不是monochrome设备，则等于0)；

7.resolution;