BFC 学習ノート

1. 定義

BFC: ブロックレベルのコンテキスト

2. 特長

1. 各 BFC エリアにはそのサブ要素のみが含まれ、そのサブ要素のサブ要素は含まれません。
2. 各 BFC エリアは独立して分離されており、相互に影響を与えません。

3. BFC 条件のトリガー

1. 本体のルート要素

2. フローティングを設定し、何も除外しません

3. 絶対位置または固定位置を設定します。

4. インラインブロック表示モード、inline-block

5. オーバーフロー、つまり非表示、自動、スクロールを設定します。

6. 表セル、表セル

7. 柔軟なレイアウト、フレックス

4. BFC を使用して問題を解決する

1. 外周縁の垂直崩れの問題を解決
2. 崩れを含む親子ボックスの問題を解決
3. 浮きの影響をクリア

おすすめ

転載: blog.csdn.net/weixin_45753588/article/details/125499988