Bootstrap 4 alphaの主な特徴、IE8のサポート終了、Sassに移行、CSSの単位はremとem採用
Post on:2015年8月20日
2015年8月19日(Bootstrap誕生4周年)にリリースされた、Bootstrap 4 alphaの主な特徴を紹介します。
IE8のサポート終了、Sassに移行、CSSの単位はremとem採用など、かなり変更されています。
上記の公式ブログに主な特徴が掲載されていたので、ざっと意訳しました。
-
- LessからSassに移行
- コンパイラにはlibSassを使用。
-
- グリッドシステムの改善
- モバイルデバイスへのターゲットをより良く新しいグリッドシステムを加え、mixinsを総点検しました。
-
- オプトインでFlexboxをサポート
- Flexboxベースのレイアウトやコンポーネントが利用可能に。
-
- 新コンポーネント「Card」
- Cardはwell, thumbnail, panelの代わりとなるBootstrapの新しいコンポーネントで、より使いやすいよう改善。
-
- HTMLリセットは新しいモジュールに統合
- Normalize.cssをどこでストップするかがリブートのステップで、一つのSassファイルで全てを管理します。
-
- 新しいカスタマイズできるオプション
- グラデーション、トランジション、シャドウなどv3のように別のスタイルシートにするのではなく、Sassの変数でカスタマイズできるようにしました。
-
- IE8のサポートは終了、remとemを採用
- IE8はCSSの最も良い部分を利用できないため、サポートを終了します。サイズの単位はpxではなく、remとemに変更します。もしIE8対応が必要なら、Bootstrap3を使用してください。
-
- JavaScriptのプラグインを書き直しました
- すべてのプラグインは、JavaScriptの新しい拡張を利用するためES6で書き直されました。
-
- ツールチップの自動配置を改善
- Tetherと呼ばれるツールでツールチップを改善しました。
-
- ドキュメントの改善
- ドキュメントはすべてMarkdownで書き直しました。
-
- その他
- フォームコントロール、マージンとパディングのclass、新しいユーティリティのclass、他にもたくさんの変更が含まれています。
CSSのサイズ指定の単位は、下記ページが参考になると思います。
- フォントのサイズ指定はpx? em? 既存の再検討とこれからのテクニック
- フォントサイズの指定方法の基礎知識からレスポンシブに適した指定方法までやさしく解説
- ビューポート(vw, vh)とパーセント(%)、レスポンシブに適した単位の賢い使い分け方法
Bootstrap v4 alphaは、下記ページからダウンロードできます。
sponsors