定义css设备类型

移动时代是任何网页设计师和开发者不可忽略的一个时代，现在我设计的页面有时会在电脑大屏幕上或者移动小屏幕上显示。如何让同一个网站同时适应完全不同尺寸的屏幕，css3完美地解决了这些问题。在css2.1版本时候，我们曾经为网站设计不同的css样式文件，如打印样式表文件，手机样式文件，电脑样式文件等等，css3提出的mediaqueries解决了这些问题。


css3的mediaqueries可以帮助设计师获取以下数据：

1.浏览器的窗口的宽度和高度，

2.设备的宽和高；

3.设备的手持方面，横向还是竖向；

4.分辨率；

到过火张信哲目前为止，mediaqueries模块得到了firefox浏览器、safari浏览器、chrome浏览器以及opera浏览器的支持。


mediaqueries的使用方法：

@media设备类型and(设备特性){样式代码}

在代码的开头必须要写”@media”,然后制定设备类型。css中定义了

media types
媒体类型css version
版本co怎么增加电脑内存mpatibility
兼容性description
简介allcss2所有浏览器用于所有媒体设备类型auralcss2opera用于语音和音乐合成器braillecss2opera用于触觉反馈正宗油焖大虾设备handheldcss2chrome,safari,opera用于小型或手持设备printcss2所有浏览器用于打印机projectioncss2opera用于投影图像，如幻灯片screencss2所有浏览器用于计算机显示器ttycss2opera用于使用固定间距字符格的设备。如电传打字机和终端tvcss2opera用于电视类设备embosdcss2opera用于凸点字符（盲文）印刷设备

设备特性的书写放手与样式的书写方式很相似，分为两个部分，当中有冒号分割，冒号前书写设备的某种特性，冒号后书写该特性的具体值


对于这13种设备特性的说明如下表：

特性可指定的值是否允许使用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关键字来指定当某种设备类型的某种特性的值满足某个条件时所使用的样式，例如：

@mediascreenand(max-width:639px;)

设备特性的指定值接受min/max的前缀，用来表示大于或者小于等于的逻辑，以此避免使用<或者>这些字符。