最近CSSフレームワーク、Bulumaが熱いと噂なので少しですが、試してみました。
ちなみに筆者はデザイナーではありませんし、CSSなんてなんとなくでコーディングしているので、
技術的にこのフレームワークのスゴい所などは紹介できません。
お恥ずかしながら、ブロック要素を横横並びにする際、とりあえずfloatでいいやーみたいなスタンスの人なので期待しないでください。
まず、簡単にですが触ってみてよかった点を列挙していきたいと思います。
- ドキュメントが充実していること。
- 導入が簡単であること。
- 学習コストがそんなに大きくないこと。
- レスポンシブ対応であること。
- カスタマイズ性が柔軟であること。
ファイルがSaas形式でも提供されているため、ベースとなるフォントカラー、レスポンシブレイアウトで指定する画面のサイズ等を簡単に変更することができます。
イマイチだった点を挙げるとするならば、クラス名が長いものが多いので、めんどくさがり屋の筆者にとっては、コーディングする際に少し気になったくらいでしょうか。
(has-background-grey-darker ,is-paddingless 等)
ただ後々コードが修正されることを考えると、クラスの命名は大変わかりやすいのでメリットのほうが圧倒的に大きいです。
最後に試してみたい方がいらっしゃるかもしれないので、導入手順を簡単に記載して終ろうと思います。
- CDNを利用
以下の記述を使用したいHTMLファイルに追加するだけです。
<link rel=”stylesheet” href=”https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.1/css/bulma.css”> - GitHubからダウンロード
GitHubからソースコード一式をダウンロードした後、CDNを利用する際と同じようにHTMLファイルに読み込ませる。
※Saasの編集にも対応
以上。