今天看了一些CSS框架,沒想到越看越多,而且越來越往UI Component上面走,整理一下各自的特點,備忘,這里不包含Bootstrap和Semantic UI。
- Skeleton 13304喜歡
- 依賴normalize.css
- 很輕量,400行
- 對默認元素進行設定
- 扁平,藍色為基調(diào)
- not a UI framework,組件很少
- Mini.css 111喜歡
- 無依賴
- 有點輕量40kb+
- 基于class
- 扁平,灰色
- 基本組件都有
- 組件化,可定制化
- bulma 11360喜歡
- 無依賴
- 120+kb大小
- 扁平,局部有陰影,綠色為基調(diào)
- 自稱modern,flexbox布局
- 高度組件化
- milligram 4804喜歡
- 依賴normalize.css
- 10k
- 娘炮紫色
- 基本組件
- materialize 23830喜歡
- 還算主流
- 需要js配套文件,jquery和他自己的materialize.js
- css大小為100+kb
- materia 風格
- Wing 1041喜歡
- Minimal CSS Framework,小
- 扁平,dark主題
- 只有基本組件
-
UIkit 8121喜歡
不喜歡這個顏色和設計風格 -
https://www.muicss.com/
MUI是一個輕量級的CSS框架,遵循Google的Material Design設計方針
小結(jié)
非主流也分二類:
大而全
有點類似做 Bootstrap 樣子大而全的:Semantic UI、UIkit,感覺 bulma 也在往這個上靠。
不過我還是會選 bootstrap。
小而美
有些甚至只提供基本樣式,如:Skeleton、Wing、milligram、Mini.css。
其中 Mini.css 組件最完整,Wing 不夠完整但無依賴。
CSS 框架真難選,不過回過來看,如果沒有設計,又需要豐富的組件,那還不如就用喜歡在 10w+ 的 Bootstrap 省心,如果項目小,盡量選不用學習曲線的不用 class 的小而美的,Wing就很不錯。