フローティング要素はページの通常の流れとどのように相互作用するのでしょうか?

フローティング要素とフローとの関係

あなたの質問は、HTML/CSS のフローティング要素の概念を中心に展開しています。答えを見てみましょう:

1. 「フローの一部が残っている」の意味

フローティング要素はページの通常のフローから削除されますが、フローの一部は残ります。これは、フローに影響を与えない絶対配置要素とは異なり、テキスト要素とインライン要素がそれらを囲むことができることを意味します。

この例では、「まだフローの一部が残っている」とは、最初の DIV (". left") は左に浮いても流れに残ります。これは、テキストが依然として周囲を回り込むことができるという事実によって明らかです。したがって、最初の DIV はフローの「外側」にあるのではなく、コンテンツがフローの周囲を流れることを可能にする方法で配置されます。

2. 3 番目の DIV を含むブロックの外側に配置

3 番目の DIV (".right") は右にフローティングされ、これにより含まれるブロック (セクション要素) の外に押し出されます。これは、前の DIV (「.left」と「.left_second」) によって、含まれているブロックの右側にある使用可能なスペースが使い果たされているためです。

この問題を修正し、3 番目の DIV をブロックを含む場合は、次のいずれかを行うことができます:

• Set "float: left;" 3 番目の DIV で、2 番目の DIV の隣に配置されます。
• 3 つの DIV をすべて収容できるように、含まれるブロックの幅を増やします。

以上がフローティング要素はページの通常の流れとどのように相互作用するのでしょうか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。