圖片也要RWD
目的 圖片類型 手段
• 小螢幕顯示比較小張的
圖,
減少載入流量
提高縮放與滑動時的整
體網頁效能
• 高品質螢幕(如Retina
Display)顯示更好的圖
• CSS
圖片
• 使用media query切換
• HTML
圖片
• 使用 javascript 套件切換 ex. rwd.images.js
• 由伺服器端處理
• Picture element (未定案)
• srcset (未定案)
隨螢幕滿版縮放,符合全
畫面(Fit Screen)
使用相關Css 屬性
max-width, min-width, width
max-height, min-height, height
Background-size, background-cover