最近在做一些頁面打印時的特殊處理接觸到了media queries，想系統(tǒng)學習一下，在MOZILLA DEVELOPER NETWORK看到一篇文章講的很不錯，結合自己的使用總結一下。

CSS2/media

在CSS2中可以使用media屬性可以使特定style只在指定媒體類型下其作用,比如頁面有些部分需要在打印的時候隱藏或者變大，這時候可以使用media使某些style只在打印的時候生效

常用的媒體類型有

1.all（所有），適用于所有設備。
2.handheld（手持），用于手持設備。
3.print（印刷），用于分頁材料以及打印預覽模式下在屏幕上的文檔視圖。
4.projection（投影），用于投影演示文稿，例如投影儀。
5.screen（屏幕） ，主要用于計算機屏幕。
在使用的時候可以在樣式表直接書寫 @media指令+空格+媒體類型（多個都好隔開）

CSS3/meidia queries

在CSS3中對其進行了增強，添加了更多的媒體查詢，CSS3中的Media Queries增加了更多的媒體查詢，同時可以添加不同的媒體類型的表達式用來檢查媒體是否符合某些條件，比如如果網(wǎng)頁用PC訪問和Pad訪問使用不同的style，在CSS2中只能把媒體類型設為screen是不能做到的，而在CSS3中可以對screen類型媒體設置表達式進一步判斷屏幕大小來實現(xiàn)這一功能。可以寫出這樣的代碼

當媒體類型匹配且表達式為真的時候，對應style就會其作用，除非使用not或者only操作符，否則媒體類型不是必需的，默認代表所有媒體類型。

操作符
and

and操作符用于將多個media feature組合成一個查詢，同時用于組合media type 和media feature，一個基本的media query類似這樣，一個meidia feature作用于所有media type

@media (min-width: 700px) { ... }

但是如果只想在橫向顯示時應用就可以使用and操作符把media type和media feature結合起來