擁抱Material Design！你的世界裡不應該只有Bootstrap

標籤：

 前言

當然這裡談論的是前端UI設計類架構，如果你開啟了這篇文章，那你一定不會陌生bootstrap吧，如果你還沒聽過bootstrap，那就請你關閉了這個頁面，當這個文章從來沒存在過！如果你對Material Design一無所知或者不是很瞭解 ，強烈移步《material design學習筆記》這篇文章，超贊！看完你一定會愛上Material Design的！當然，同時他對我們前端的UI實現要求也更高了！

在2014年Google高調展示了他們最新的Material Design設計方案，一改往日“不欣賞設計，對設計毫無感覺”的Google形象！同時當然也震驚了整個設計界啦！什嗎？你還沒看《material design學習筆記》？請看完再回來看下面內容！

 

如果你的前端水平還不是很高，沒關係！我推薦幾個不次於bootstrap的Material Design前端架構給你！

bootstrap-material-design

適合於已經執迷於bootstrap的童鞋，他就像是一個bootstrap的Material Design風格的模版，用法和bootstrap完全一樣，demo的代碼也非常清楚，但是畢竟是基於bootstrap的模版，很多Material Design的UI細節還是沒有實現，比如toast的滑動刪除，dialog開啟的動畫效果，tooltip的展示效果，dropdown菜單展開效果等等，都有點差強人意（如果你不明白我說的這些細節，仔細閱讀《material design學習筆記》），而且Tab UI部分還沒實現！總之給你的感覺就只是顏色改了，UI組件的樣子變了，Material Design特色的wave效果有了，似乎沒什麼太大的UI互動改變，兩個字“沒勁”！不是很推薦！

materialize

這個就完全不同了，這個還算比較有良心的，demo的代碼也很清楚，css組件和js組件也比較齊全，用法也和bootstrap類似（當然類似了！前端css架構都一個德行）！當然和完整的Material Design比起來，有時候還得需要自己加點效果，強烈推薦！

ps：這網站是英文版的，但是我認為是好事，因為你比別人更先接觸！等中文站出來了可能你就慢一步了！就像bootstrap一樣，還沒bootcss.com中文站的時候，你要是就接觸了Tweet官網的bootstrap，那說明你一定是一名Geek，那會兒設計出來的網站絕對會讓別人眼前一亮，不像現在，bootstrap都爛大街了，一點也不高大上

 

結語

其實還有很多打著Material Design名號的css架構，由於還沒看到一個好於materialize的，所以就不在這浪費口舌推薦出來了，如果你發現了哪個比materialize還強大的架構，歡迎留言推薦出來！

原文連結：http://www.gbtags.com/gb/share/6177.htm

擁抱Material Design！你的世界裡不應該只有Bootstrap