CSSフレームワークのBootstrap5が正式リリースされました。jQueryが不要となり、古いブラウザが動作対象外となりました。新しいコンポーネントが追加されたほか、細かく改良されています。
ブラウザのサポート
Bootstrap5では、古いブラウザが動作対象外となりました。
- Internet Explorer10、11は対象外
- MicrosoftEdge Legacy (ChromeエンジンではないMS Edge)
- FireFox 60未満
- Safari 10未満
- iOSSafari 10未満
- Google Chrome 60未満
- Android 6未満のWebView
jQueryへの依存の削除
これまでのBootstrap4では、jQueryに依存したコンポーネントが多数含まれていました。jQueryは現代的なJavaScriptプログラミングの手法からは程遠いものです。
Bootstrap5では、Vanilla JavaScript(生のJavaScript)で書かれており、軽量化されました。
オフキャンバスコンポーネント
好きな位置でモーダルダイアログみたいな表示ができます。一覧>編集のようなUIで使えそうです。モーダルダイアログよりも、スクロール時の使い勝手がよく、便利そう。

新しいフォーム
フォーム系のコンポーネントが改良されました。
チェックボックス、ラジオボタン、スイッチ
チェックボックス、ラジオボタン、スイッチが、異なるブラウザでも統一した外観となりました。

フローティングラベル
フローティングラベル。入力フォームの内側にラベルを表示することができ、イケてます。


マニュアルのFloating Labelsを確認して下さい。
ファイル入力
.form-fileクラスは排除されました。単に.form-controlを使いましょう。

<div class="mb-3">
<label for="formFile" class="form-label">Default file input example</label>
<input class="form-control" type="file" id="formFile">
</div>
その他
その他、多数の機能が改良されているようです。本番利用の時期を見定めながら、最新のBootstrap5を試していきましょう。