現在是 https://www.w3.org/TR/2017/WD-mediaqueries-4-20170324/

@media 媒體查詢 Media Query

它是一個邏輯表達式：not, and, only 混用以 , 隔開條件串

媒體類型

Media types -- MDN

• all
• print
• screen：主要用於彩色電腦屏幕。
• speech：用於 speech synthesizers (語音合成器)。ps1

媒體功能

Media features -- MDN 每個 features 測試瀏覽器或設備的一個特定功能。

basic

• width : 視口寬度
• height : 視口高度
• aspect-ratio : 視口的寬高比寬高比
• orientation : 視口方位
• resolution : 輸出設備的像素密度
• scan : 輸出設備的掃描過程
• grid : 設備是 grid (ex 終端機、盲用裝置...) 或是 bitmap (ex screen, print... )

what is what?

• update-frequency : 更新-頻率（if at all）輸出裝置修改內容呈現的速度多快 在媒體查詢級別 4 中添加
• overflow-block
  • 輸出設備如何處理 handle content that overflows the viewport 溢出視口的內容 along the block axis? 沿著區塊軸線 在媒體查詢級別 4 中添加
    • isit?： 行內的排列是依據行內軸線 (是字的基線所依據的那條線？)，那區塊軸線影響和作用什麼？
    • isit?： 區塊內的行內區塊元素、區塊內的行內元素。
• overflow-inline
  • 沿著行內軸線溢出視口的內容，是否可被捲動。？ Can content that overflows the viewport along the inline axis be scrolled? 在媒體查詢級別 4 中添加
    • isit?： 行內的排列是依據行內軸線 (是字的基線所依據的那條線？)。
• color : 色彩解析度/深度 ( 8 bit/ 16 bit/ 32 bit color...) 設備每個顏色元件 bits 數量，如果設備不是彩色，則為 "zero"。
• color-index : 輸出裝置的颜色查找表項目數量, 若設備不使用則為 "zero".
• display-mode : 應用程序的顯示模式，開發人員對 Web 應用程序的首選顯示模式( e.g. 全螢幕、獨立應用程式、瀏覽器開啟...) 定義在 Web App Manifest(表現) 規範中。
• monochrome 在輸出設備單色影格緩衝區中每像素的 bits ，如果設備不是單色，則為 0。

new

• inverted-colors : 用戶代理或底層操作系統是否反轉顏色？ 在媒體查詢級別 4 中添加
• pointer : 主要的輸入機制是 pointing device ( e.g. 滑鼠 ) 的話，準確性多少？ 在媒體查詢級別 4 中添加
• hover : 主輸入機制是否允許鼠標懸停？ 在媒體查詢級別 4 中添加
• any-pointer : 任何輸入機制是 pointing device, 有的話準確性多少？ 在媒體查詢級別 4 中添加
• any-hover : 是否有任何機制允許鼠標懸停？ 在媒體查詢級別 4 中添加
• light-level : 當前環境光 Current ambient light level 在媒體查詢級別 4 中添加
• scripting : 腳本（例如 JavaScript）可用嗎？ 在媒體查詢級別 4 中添加

已棄用

• device-width
  • 輸出設備的渲染表面的寬度 媒體查詢第 4 級已棄用
• device-height
  • 輸出設備的渲染表面的高度 媒體查詢第 4 級已棄用
• device-aspect-ratio
  • 輸出設備的寬高比寬高比 媒體查詢第 4 級已棄用

-webkit- 前綴

• -webkit-device-pixel-ratio
  • 每個 CSS 像素的物理設備像素數 非標準 WebKit / Blink 特定。如果可能，請改用 resolution 媒體功能。
• -webkit-transform-3d
  • 是否支持 CSS 3D transform？ 非標準 WebKit / Blink 特定
• -webkit-transform-2d
  • 是否支持 CSS 2D transform？ 非標準 WebKit 特定
• -webkit-transition
  • 是否支持 CSS transition？ 非標準 WebKit 特定
• -webkit-animation
  • 是否支持 CSS animation？ 非標準 WebKit 特定

ps1 注意：CSS2 具有類似的媒體類型 "aural"。詳細信息請參閱聽覺樣式表的附錄 appendix(附錄) on aural(聽覺) style sheets。