Web 前端開發-零基礎入門:第三堂

經過前兩堂的課程,學員已經具備利用CSS建立版面的基礎能力,第三堂進一步討論因應行動裝置發展的響應式設計網頁,討論入門相關的數個關鍵議題。
  • Viewport
  • 流動佈局
  • 媒體查詢
其中 Viewport 讓行動裝置自動以適當的尺寸呈現網頁內容,流動佈局透過百分比取代絕對單位確保網頁能在任何裝置完整呈現。媒體查詢則在適當的viewport設定與流動佈局的設計基礎上,進一步透過斷點設定,讓網頁在特定尺寸的螢幕上均能呈現完美佈局與面配置。

Firefox 提供Rwd 初步入門檢視工具「適應性設計檢視模式」,開發人員可以在這個工具進行初步的測試。



完成上述的響應式設計基礎課程,學員能夠透過CSS建構自動適應任何尺寸的裝置螢幕。

我們已經釋出了一系列方便閱讀的RWD技術短文,未能參與課程的朋友也可以透過「RWD 系列文章」建立響應式網頁的設計基礎。

沒有留言: