ホームページ  >  記事  >  ウェブフロントエンド  >  CSS之BFC_html/css_WEB-ITnose

CSS之BFC_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-24 11:40:531167ブラウズ

BFC (ブロック フォーマット コンテキスト、ブロック フォーマット コンテキスト)

BFC 特性を持つ要素は、分離された独立したコンテナーと見なすことができ、コンテナー内の要素は外側の要素のレイアウトに影響を与えません。

CSS3 では、BFC はフロー ルートと呼ばれます。

CSS2.1 には、Normal Flow、Float、Absolute Positioning の 3 つの配置スキームがあります。


(1) BFC をトリガーするにはどうすればよいですか?

次の状況では BFC 環境が作成されます:

(a) 浮動 (要素の浮動小数点が存在しないわけではありません)

(b) 絶対配置要素 (要素の位置は絶対または固定です)

(c) ) 表示は inline-block 、 table-cell、 table-caption、 flex、 inline-flex

(d) オーバーフローは表示されません (hidden、auto、scroll の場合)


(2) の特徴は何ですかBFC? F b (a) BFC は垂直マージンフォールド (つぶれ) を防ぎます。また、同じ BFC の下にない場合はフォールドされません。

(b) BFC は浮動要素に「対応」できます

著作権表示: この記事はブロガーによるオリジナルの記事であり、ブロガーの許可なく複製することはできません。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。