筆記
Box Model 盒模型
理解 Margin, Border, Padding 與 Content。掌握 box-sizing: border-box 在佈局中的關鍵作用。
從基礎屬性到現代排版布局的深度探索
點選下方卡片進入各別的筆記與練習頁面
理解 Margin, Border, Padding 與 Content。掌握 box-sizing: border-box 在佈局中的關鍵作用。
一維排版的核心,掌握主軸與交叉軸對齊,輕鬆實現物件的水平與垂直置中。
現代二維佈局,定義軌道與區域,處理複雜網頁架構的最強排版工具。
理解 Relative、Absolute 與 Fixed 的空間脫離關係,實作漂浮按鈕與固定選單。
掌握偽類、偽元素與後代選擇器,理解 CSS 權重計算規則,精準覆蓋樣式。
利用 :root 管理色票與間距設定。提升代碼複用性,實作主題切換的設計系統。