Bootstrap4移行ガイドを読む（コンポーネント編、モーダル）
- Webページのひとつ上にレイヤーを重ね、ユーザーに限定的な行動をさせるコンポーネント
- Bootstrapのモーダルは背景（backdrop）をクリックすると閉じるボタンを押した時と同じように、消える
- モーダルコンポーネントを使うには、
.modalで要素を包み、その中に必要なインナーパーツをいれる.modal .modal-dialog .modal-contentみたいな感じ- この中に
.modal-header,.modal-body,.modal-footerが入る
- モーダル表示にアニメーションを加えるには
.fadeクラスを.modalに追加する - モーダルは通常ページのトップから少し離れた場所に表示される
- 垂直方向中央に表示するには、
.modal-dialogと同じ要素に.modal-dialog-centeredを指定する - ツールチップをモーダル内に表示することもできる。JavaScriptを使う
- ポップオーバーをモーダル内に表示することもできる。JavaScriptを使う
.modal-body内に.container-fluidを入れ子にして、モーダル内でグリッドを使うことも可能.modal-dialogに.modal-lgを追加するとモーダルが大きくなる.modal-dialogに.modal-smを追加するとモーダルが小さくなる
