CSSフレームワークBulmaがとてもいい
CSSフレームワークを入れ替えました
このサイトのフレームワークをBootstrapから、Bulmaに変更しました。
まだ移行したばかりなので、これから使いやすいように調整していきます。
名前の由来はドラゴンボール
Bulmaは日本語で「ブルマ」と呼びます。
ちょっと人前で言いづらい名前ですよね。
しかし安心(?)です。名前の由来はドラゴンボールからです。
この記述によれば、元々はトランクスというテーマジェネレータで、 カプセル化→カプセルコーポレーション→ブルマという連想らしいです。
BootstrapよりBulmaの方がいい理由
Bootstrapと比べて自分が気に入った点を挙げます。
JavaScriptがほとんど不要
BootstrapはjQueryが必須です。 一方でBulmaはCSSのみで記述されています。
ただもちろん、JavaScriptがないとできないこともあります。
例えばハンバーガーメニュー(幅を狭くすると出てくる3本線)の開閉にはJavaScriptを使います。
サンプルコードのコピペでもOKです。ただしIE11ではアロー関数が使えないので書き換えが必要です。
修飾子(Modifiers)が自然
Bootstrapの不満点として、修飾子(Modifiers)が分かりにくいことでした。
Bootstrapではコンポーネントなのか修飾子なのかが分かりづらく、
btn-lg のように不自然な省略形が使われています。
Bulmaでは button is-large のようにパッと分かりやすい修飾子が使えます。
ドキュメントがわかりやすい
Bootstrapで悩んでたのが、Navbarのような複雑なコンポーネントの場合、 どのように書けばいいか分からないことでした。
とりあえず動かすことはできましたが、モヤモヤ感がのこりました。
Bulmaでは階層構造が明記されていて、分かりやすいです。
IE対応は注意が必要
BulmaはIEはサポートしていません。
ただ、IE11で90%は動くと書いてます。
このサイトも一部表示が乱れますが、IE11で表示するように修正しています。
←松山市でお酒を探すなら津田酒店がおすすめ
ドラゴンクエストビルダーズはDQ1を思い出すゲーム→