ゆうなんとかさんの雑記帳的な。

Twitterで踊ったり音ゲーしたりしてるあの名前がよくわからない人が書いてるらしいよ。

Bootstrap3.0をいまさらながらおさらいしてみた

このブログでもときどき折にふれて話をしていた気がする有名なCSSフレームワーク「Bootstrap」。
この夏にはバージョン3になってフラットデザイン、モバイルファーストといった最近はやりのキーワードを引っさげ、装いも新たになりました。
RC時代から見てきた人もいて今更感漂いますが、私も大きなところから小さなところまで比べてみていこうと思います。

大きな違い

ぱっと見て分かるとおり、全体を通してフラットデザインになりました。ボタンやヘッダーバーにあったてかりのエフェクトや、至るところにあった影がなくなりました。
また、テキストフォームの既定幅が画面いっぱいとなりました。
それから、カラムのブレークポイントが「モバイル向け、タブレット向け、PC向け2種」の4つに増えたため、カラムを分けるためのクラスがcolumn-*から小さい順に.col-xs-*、.col-sm-*、.col-md-*、.col-lg-*となりました。

細かな違い

今まではBootstrap本体とレスポンシブデザインのためのスタイルシートが分かれていましたが、今回統合され、既定でレスポンシブデザイン対応となりました。
この際古いブラウザ向けのハックが削除され、IE7以前と同じ世代の古いブラウザはサポート対象から外されました。
また、この他にもクラス名がいくつか変更され、そもそも不要となったクラスは削除されました。詳細はこちらにあります。
Getting started · Bootstrap

本当は画像も貼り付ける予定でしたが、フォトライフがメンテナンスに入ってしまったとはこれいかに…