10分鐘學會SCSS常用語法-學習筆記
使用Prepros編譯SCSS
- 巣狀寫法 - 減少重複編寫HTML屬性
- 變數使用 - 全域設定CSS變數(顏色、字體)
- @import - 每隻SCSS功能分開，再彙整成一隻檔案(_reset下底線=合併用檔案)
- @extend - 繼承擴充
- @mixin - 轉化常用語法，可帶入變數(@include載入)
- @content - grid.scss斷點設計
SCSS結構 - @import
- mixin - 全域變數+Mixin
- variable - 變數
- reset - reset.css
- layout - 共同框架
- module/button - 按鈕,表單,表格
- index - 首頁
- page/.. - 內頁
SCSS設計 - RWD
- 設定常用變數
- import設計
- 區隔layout
- 斷點設計
- page SCSS獨立