媒體查詢表達式的使用方法

語法

@media  設備類型 and (設備特性){樣式}

制定設備的值	設備類型
all	所有設備
screen	電腦顯示器
print	打印用紙或者打印預覽視圖
handheld	便攜設備
tv	電視類型設備
speech	語音和音頻合成器
braille	盲人用點字法觸覺回饋設備
embossed	盲文打印機
projection	各種投影設備
tty	使用固定密度字母刪格的媒介，比如電打字機和終端

css中13中設備特性：

特性	特性值	使用min/max前綴	說明
width	400px	允許	瀏覽器窗口寬度
height	200px	允許	瀏覽器窗口高度
device-width	400px	允許	設備屏幕分辨率的寬度值
device-height	400px	允許	設備屏幕分辨率的高度值
orientation	portrait或者landscape	不允許	瀏覽器窗口是橫向還是縱向，當高度大於寬度的時候，特性值是portrait，否則landscape
aspect-ratio	比例值，16/9	允許	瀏覽器窗口的縱橫比例，比例值爲瀏覽器寬度/高度
device-aspect-ratio	同上	同上	屏幕分辨率縱橫比，比例值爲設備屏幕分辨率的寬度值/高度
color	整數值	允許	設備使用多少位顏色值，若不是彩色設備，該值爲0
color-index	整數值	允許	彩色表中的彩色數值
monochrome	整數值	允許	單色幀緩衝器中每像素的字節數
resolution	分辨率值 ，300dpi	允許	設備分辨率
scan	指定兩個值：progressive/interlace	不允許	電視機設備的掃描方式，progressive表示逐行掃描，interlace：隔行掃描
grid	0/1	不允許	設備是基於刪格還是基於位圖，基於刪格該值爲0

@supports

@supports (display:grid) {
    
    //在瀏覽器支持css網格佈局的時候，使用該樣式代碼
}