鐵人檔案
什麼是Sass? Sass的全名是Syntactically Awesome Stylesheets 是一種擴展的CSS預處理語言 什麼是SCSS? SC...
Sass/SCSS 的優勢 可重用性 : 減少重複代碼 變數支持：樣式變更更加方便 巢狀（Nesting）規則 : Sass/SCSS 支持巢狀語法，編寫樣式...
CSS是什麼 Cascading Style Sheets 一種用來為結構化文件（如 HTML 文件或 XML 應用）添加樣式（字型、間距和顏色等）的電腦語言...
變數 Variables (1) 指一個抽象的儲存位址，含有了被稱為一個值的某種已知或未知的資訊量，並且配對了關聯的符號名稱 Sass/SCSS允許使用變數...
顏色 例子 :$primary-color: #3498db; // 定義變數 $primary-color，表示主要顏色$light-primary:...
布林 Boolean 例子 :$is-dark-mode: true; // 是否啟用暗模式 body {@if $is-dark-mode {bac...
巢狀結構 Nesting 是什麼？ 指將 CSS 規則寫在另一個 CSS 規則的內部，以表示它們之間的層級關係 使得 CSS 樣式的結構更加直觀，尤其是處理巢...
過度巢狀的問題 生成過於複雜的選擇器：過多的巢狀會導致生成的 CSS 選擇器過於長且複雜，影響性能 維護困難：巢狀層次過深時，修改樣式會變得困難，因為需要追蹤...
巢狀結構的例子 HTML CSS.menu {background-color: #333; //選擇 menu class 的 div 元素，將背...
過度巢狀的例子.container {.header {.nav {ul {li {a {&:hover {color: red;}}}}}}}...
