@media

定义和使用 使用 @media 查询，你可以针对不同的媒体类型定义不同的样式。 @media 可以针对不同的屏幕尺寸设置不同的样式，特别是如果你需要设置设计响应式的页面， @media 是非常有用的。 当你重置浏览器大小的过程中，页面也会根据浏览器的宽度和高度重新渲染页面。 浏览器支持 表格中的数字表示支持 @media 规则的第一个浏览器的版本号。 CSS 语法 [@media](http://my.oschina.net/u/1447355) mediatype and|not|only (media feature) { CSS-Code; } 你也可以针对不同的媒体使用不同 stylesheets : <link rel="stylesheet" media="mediatype and|not|only (media feature)" href="mystylesheet.css"> 媒体类型(mediatype) 值 描述 all 用于所有设备 aural 已废弃。用于语音和声音合成器 braille 已废弃。 应用于盲文触摸式反馈设备 embossed 已废弃。 用于打印的盲人印刷设备 handheld 已废弃。 用于掌上设备或更小的装置，如PDA和小型电话 print 用于打印机和打印预览 projection 已废弃。 用于投影设备 screen 用于电脑屏幕