[Css framework] Bulma 使用心得



今天要來介紹的是 Bulma,Bulma 以 Flex 為基礎,沒有 Js 依賴,為純 Css framework,所以蠻輕量的,一整個簡約風(文件也是 …)。

各框架也都有出相關套件,如果是 Vue ,可以使用 buefy,不過這次是用 JQuery 來做 Side proj,所以就不討論這塊了。

在這次專案裡,主要用到 Bulma 的 columncard
簡單好用,命名規則也很簡潔,在 DOM 上 加幾個 class ,介面就出來啦 !

1
2
3
4
5
6
.columns
.column
.card
.card-header
.card-image
.card-content

Desktop 畫面

Mobile 畫面(Bulma 以移動裝置為優先)

如果是做小專案或是獨立開發,還蠻推薦使用 Bulma,如果是多人合作,可能要考慮它的維護性(台灣使用者不多),則可以選擇較著名的框架,如: Bootstrap。

選擇 Css framework 是幫助我們快速開發介面原型,而 Bulma 的特色就是簡單,易學易用,幫助開發者提升生產力。

如果您有什麼想法,歡迎在下面留言討論,謝謝 !

評論

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×