隨著科學(xué)技術(shù)不斷的向前發(fā)展，網(wǎng)頁的瀏覽終端越來越多樣化，用戶可以通過：寬屏電視、臺式電腦、筆記本電腦、平板電腦和智能手機(jī)來訪問你的網(wǎng)站。盡管你無法保證一個網(wǎng)站在不同屏幕尺寸和不同設(shè)備上看起來完全一模一樣，但至少要讓你的Web頁面能適配用戶的終端，讓他更好的呈現(xiàn)在你的用戶面前。在本節(jié)中，將會學(xué)到如何使用CSS3中的Media Queries模塊來讓一個頁面適應(yīng)不同的終端（或屏幕尺寸），從而讓你的頁面讓用戶有一個更好的體驗(yàn)。

Media Queries

Media Queries是CSS3新增加的一個模塊功能，其最大的特色就是通過CSS3來查詢媒體，然后調(diào)用對應(yīng)的樣式。其實(shí)這個功能在CSS2.1中就有出現(xiàn)過，只不過那個時候此功能并不強(qiáng)大，我們最常見的就是給打印設(shè)備添加打印樣式。隨著時代的變化，這個模塊功能越來越強(qiáng)大。

在徹底的了解Media Queries我們需要了解其中的兩個重要部分，第一個是媒體類型，第二個是媒體特性。下面的內(nèi)容我們簡單的來了解這兩個部分：

一、媒體類型

媒體類型（Media Type）在CSS2中是一個常見的屬性，也是一個非常有用的屬性，可以通過媒體類型對不同的設(shè)備指定不同的樣式。

在CSS2中常碰到的就是all(全部)、screen(屏幕)、print(頁面打印或打印預(yù)覽模式)，其實(shí)媒體類型遠(yuǎn)不止這三種，W3C總共列出了10種媒體類型。如下表所示：

其中Screen、All和Print為最常見的三種媒體類型。