定义css设备类型-Media Queries
移动时代是任何网页设计师和开发者不可忽略的一个时代，现在我设计的页面有时会在电脑大屏幕上或者移动小屏幕上显示。如何让同一个网站同时适应完全不同尺寸的屏幕，CSS3完美地解决了这些问题。在CSS2.1版本时候，我们曾经为网站设计不同的CSS样式文件，如打印样式表文件，手机样式文件，电脑样式文件等等，css3提出的Media Queries 解决了这些问题。
CSS3的Media Queries 可以帮助设计师获取以下数据：
1. 浏览器的窗口的宽度和高度，
2.设备的宽和高；
3. 设备的手持方面，横向还是竖向；
4. 分辨率；
到目前为止，Media Queries 模块得到了Firefox浏览器、Safari浏览器、Chrome浏览器以及Opera浏览器的支持。
Media Queries的使用方法：
@media 设备类型 and (设备特性){ 样式代码}
在代码的开头必须要写"@media",然后制定设备类型。css中定义了
特性可指定的值是否允许使用min/max前缀特性说明width带单位的长度数值允许浏览器窗口的宽度height带单位的长度数值允许浏览器窗口的高度device-width带单位的长度数值允许设备屏幕分辨率的宽度值device-height带单位的长度数值允许设备屏幕分辨率的高度值orientation只能指定两个值:portrait或landscape不允许浏览器窗口的方向是纵向还是横向，当窗口的高度值大于等于高度值时，该特性值为portrait，aspect-ratio比例值，例如：16/9允许浏览器窗口的纵横比，比例值为浏览器窗口的宽度值/高度值device-aspect-ratio比例值，例如：16/9允许设备屏幕分辨率的纵横比，比例值为设备屏幕分辨率的宽度值/高度值color整数值允许设备使用多少位的颜色值，如果不是彩色设备，该值为0color-index整数值允许色彩表中的色彩数monochrome整数值允许单色帧缓冲器中每像素的字节数resolution分辨率值，譬如300dpi允许设备的分辨率scan只能指定两个值：progressive或interlace不允许电视机类型设备的扫描方式，progressive表示逐行扫描，interlace表示隔行扫描grid只能指定两个值:0或1不允许设备是基于栅格还是基于位图。基于栅格时该值为1，否则该值为0
使用and关键字来指定当某种设备类型的某种特性的值满足某个条件时所使用的样式，例如：
@media screen and(max-width:639px;)
设备特性的指定值接受min/max的前缀，用来表示大于或者小于等于的逻辑，以此避免使用< 或者 >这些字符。
