【網戰CSS

CSS - CSS常用語法 HTML 與 CSS 的差異 (3:37) 插入 CSS 檔案，先寫一個 h1 讓文字變色 (5:48) CSS 寫法詳解介紹 (4:38) 新手常見 CSS 錯誤解析 (9:30) HTML 標籤選擇器 (5:43) 擬態選擇器 :hover (6:07) 類別選擇器 (13:06) 使用 CSS 優化文字排版 (10:16) 小節練習 - 使用 CSS 優化網頁 (2:50)

隨著行動裝置的普及，手機網站的建置已成為企業和個人品牌不可或缺的一部分。 本教學將帶您了解如何開始手機網站開發、需要具備的技能以及可用的軟體工具。

過去在響應式網站設計技術尚未成熟時，不同裝置分開寫的情況是比較多，電腦版會有自己一份 CSS 檔案，手機版也會有自己一份 CSS 檔。

[css] 使用 Columns 調整電腦與手機的網頁畫面 flex 和 grid 讓我們能夠很簡單的去設定 RWD，讓網頁在電腦或手機畫面上都不會跑版，以 flex 來舉例，只需要使用 Media Query 在 width 等於手機 width 的時候，去調整 flex-direction 就好。

為了提供使用者在小尺寸的行動裝置上，可以擁有良好的使用體驗，手機版網站通常會比電腦版的網站更簡化，主要是為了可以使內容能精準呈現，讓使用者能更輕鬆瀏覽頁面。 由於行動裝置相對於電腦來說網速較慢，因此需要拋棄特效、壓縮圖片檔案大小等優化，來提升內容的載入速度。 在網站開發時，先會有電腦版網站才有手機版網站的出現，所以後續需維護2個網址（電腦、行動裝置），使得維護成本相對來說也會較高。 而手機版網站與 RWD 網站，最大的差異是出在於， RWD 網站運用了 CSS 語法。 因此RWD 網站只需一個網站，就能夠

隨著行動網路的快速發展，手機端網頁設計的需求越來越重要。 為了滿足不同設備和平台的要求，我們需要使用CSS框架來幫助我們快速建立適應手機端的網頁。 以下是五個最受歡迎的手機端CSS框架的推薦：

現在也有很多平面設計師想了解手機版網頁應該如何編排，例：手機版網頁在設計上的限制與常見問題、圖片最適大小等…，如何才能在網頁上提供最佳瀏覽體驗，這篇文章就帶你來了解手機版設計的在實務上做法。