Media Queries能在不同的條件下使用不同的樣式，使頁面在不同在終端設(shè)備下達(dá)到不同的渲染效果
@media 媒體類型and （媒體特性）{你的樣式}
最大寬度max-width
“max-width”是媒體特性中最常用的一個(gè)特性，其意思是指媒體類型小于或等于指定的寬度時(shí)，樣式生效。如：
上面表示的是：當(dāng)屏幕小于或等于480px時(shí),頁面中的廣告區(qū)塊（.ads）都將被隱藏。
最小寬度min-width
“min-width”與“max-width”相反，指的是媒體類型大于或等于指定寬度時(shí)，樣式生效。
上面表示的是：當(dāng)屏幕大于或等于900px時(shí)，容器“.wrapper”的寬度為980px。
多個(gè)媒體特性使用
當(dāng)屏幕在600px~900px之間時(shí)，body的背景色渲染為“#f5f5f5”，如下所示。
設(shè)備屏幕的輸出寬度Device Width
在智能設(shè)備上，例如iPhone、iPad等，還可以根據(jù)屏幕設(shè)備的尺寸來設(shè)置相應(yīng)的樣式（或者調(diào)用相應(yīng)的樣式文件）。同樣的，對(duì)于屏幕設(shè)備同樣可以使用“min/max”對(duì)應(yīng)參數(shù)，如“min-device-width”或者“max-device-width”。
上面的代碼指的是“iphone.css”樣式適用于最大設(shè)備寬度為480px，比如說iPhone上的顯示，這里的“max-device-width”所指的是設(shè)備的實(shí)際分辨率，也就是指可視面積分辨率。
not關(guān)鍵詞
新聞熱點(diǎn)
疑難解答
圖片精選
