media queries

@media ：<sMedia> { sRules }

<sMedia>：

指定设备名称。请参阅附录：设备类型

{sRules}：

样式表定义。

判断媒介(对象)类型来实现不同的展现。此特性让CSS可以更精确作用于不同的媒介类型，同一媒介的不同条件（分辨率、色数等等）.

media_query: [only | not]? <media_type> [ and <expression> ]*

expression: ( <media_feature> [: <value>]? )

media_type: all | aural | braille | handheld | print | projection | screen | tty | tv | embossed

media_feature: width | min-width | max-width 

  | height | min-height | max-height

  | device-width | min-device-width | max-device-width

  | device-height | min-device-height | max-device-height

  | device-aspect-ratio | min-device-aspect-ratio | max-device-aspect-ratio

  | color | min-color | max-color

  | color-index | min-color-index | max-color-index

  | monochrome | min-monochrome | max-monochrome 

  | resolution | min-resolution | max-resolution

  | scan | grid