媒體型別

媒體查詢具有可選的 mediatype 引數。此引數直接放在 @media 宣告(@media mediatype)之後,例如:

@media print {
    html {
        background-color: white;
    }
}

上面的 CSS 程式碼將在列印時為 DOM HTML 元素提供白色背景色。

mediatype 引數有一個可選的 notonly 字首,它將樣式分別應用於除指定的 mediatype 僅指定的媒體型別之外的所有內容。例如,以下程式碼示例將樣式應用於除 print 之外的每種媒體型別。

@media not print {
    html {
        background-color: green;
    }
}

同樣,只需在螢幕上顯示它,就可以使用:

@media only screen {
    .fadeInEffects {
        display: block;
    }
}

使用下表可以更好地理解 mediatype 的列表:

媒體型別 描述
all 適用於所有裝置
screen 預設計算機
print 印表機一般。用於設定網站的列印版本的樣式
handheld PDA,手機和帶小螢幕的手持裝置
projection 用於預計演示,例如投影儀
aural 語音系統
braille 盲文觸覺裝置
embossed 分頁盲文印表機
tv 電視類裝置
tty 具有固定間距字元網格的裝置。終端,行動式裝置。