Scroll

「常に新しい技術に目を向けること」
「既存の技術をより深堀りすること」

カテゴリ:Bootstrap
タグ:,,,,
公開日:2015/09/29(火)
最終更新日:2021/08/05(木)

Bootstrapのメジャーアップデート

はちです。実は最近Bootstrapを使うことにハマっています。

Bootstrapとは

HTMLの知識を持った人なら、Webページを簡単に作成できるCSSフレームワークとよばれるツールの中の1つです。
Bootstrapを利用すると、今まで時間のかかっていたレイアウトもすぐにできます。
特に楽なのがモバイル対応です。規則に沿ってソースを書くだけで簡単にモバイル対応できます。

Bootstrapはデメリットも有る

Bootstrapは見た目がフラットなデザインになりがちです。
また、レイアウトのスペースの取り方がなんとなく、「あ、これBootstrapだな」ってわかります。
他のCSSフレームワークの「Foundation」なんかも見たらなんとなくわかりますが…
要するに規則的なので、ある程度はしょうがないってことですね。(何が

そのBootstrapがVer3から4になった!

Alpha版ですが、Ver3からVer4になりました。
(※2021年5月、Ver5も登場しました。)

まだAlpha版なので、暫くはVer3を使い続けるので問題ありませんが、Ver4で1番大きく変わるのが以下の3点です。

1) LessからSassに変わる
2) フォントサイズの単位がpxからem、remが標準になる
3) グリッドシステムの改良

1)は、Sassを導入してない環境であれば余り関係ありませんが、Bootstrapは元々Lessを採用していたので、大きな変更といえば変更になります。
業界標準がSassになってきたというのが大きな理由のようです。

2)これも大きな変更になりますが、普段からem、remを意識して使っていれば、今回のアップデートでは余り大きな影響は受けないと思います。

3)これが1番大きな変更だと個人的に思います。
今までのブレークポイントであるxs、sm、mdサイズのサイズが変更になります。
そして4つ目のブレークポイントxlが追加されます。
ブレークポイントが変更になることで、今までのデバイスでブレークしなかったところでブレークしたり、意図していないレイアウトになることがあるかもしれません。

さいごに

今あるサイトを3から4に上げる必要はないと思いますが、4が正式にリリースされたら、積極的にまずは4を使ってみて覚えていきたいところです。

この記事を書いた人:はち
野球と競馬のデータが好きな男。 裏の姿は夜な夜な競馬予想AIのメンテを続けている中年。


シェアのご協力をお願いいたします!

カテゴリー

アーカイブ