每當要重新開始一個專案的時候,都要重置一次 HTML 、 CSS 、 JS 環境,而在 CSS 方面卻是設定上最繁瑣的
- CSS Reset 設置
- 基本顏色變數
- 字體字型大小 ......一大堆
所以就開發一套 CSS 初始化的 layout
- 必須安裝 compass 環境與 Sass(安裝教學請自行Google)
- 是否需要更複雜的設計或更簡約的分類,請自行評估
Main.scss
├ ─ reset
compass 內建 reset
├ ─ _variables
統一變數集合
├ ─ _media
RWD 設置
├ ─ _grid
grid 設置
├ ─ _mixin
相關 mixin 設置
├ ─ _font
字體自行設定
├ ─ _img
目前暫空 純建立檔案
├ ─ _hover
Hover 效果動態
##其他備註
- 之後會在增進 Grid 方面的功能
- 6/15 更新項目,Grid 功能擴充,media 功能擴充,Hover 效果增加
- 11/9 更新 font responsive 功能(詳細用法請看註解)