1-12. CSS 新增功能與範例再學習 (依需求挑選學習)

CSS3 多媒體查詢

 

例如：

@media screen and (min-width: 480px) {
    body { background-color: lightgreen; }
}

或

@media (min-width: 480px) {
    body { background-color: lightgreen; }
}

有關多媒體查詢 【參考範例結果】

【 這是桌機版本時的排版樣子 】	【 這是手機版本時的排版樣子 】

了解螢幕顯示器的規格，參考多看看

【screensiz.es】 或 【手機屏幕尺寸大全】 或 【Device Metrics】
設計了手機、平板、桌機...等各種顯示器規格，方便快速查詢了解螢幕顯示器的規格。
查找任何屏幕的設備指標，以及相關設備RWD的資訊。