ホームページ  >  記事  >  ウェブフロントエンド  >  コンテナに複数のフローティング要素が含まれている場合にフロートをクリーンアップする方法

コンテナに複数のフローティング要素が含まれている場合にフロートをクリーンアップする方法

藏色散人
藏色散人オリジナル
2020-07-02 10:50:433483ブラウズ

コンテナに複数のフローティング要素が含まれている場合、フロートをクリアするには、追加の要素を追加し、コンテナ要素の終了タグの前に「clear:both」を設定します。「clear:both」はフロートをクリアすることを意味します。

コンテナに複数のフローティング要素が含まれている場合にフロートをクリーンアップする方法

#コンテナ要素の終了タグの前に要素を追加し、

clear: Both

親要素のトリガーを設定します。ブロックレベルの書式設定コンテキスト

  • ブロックレベルの書式設定コンテキスト。これは独立したレンダリング領域であり、この領域は外部とは何の関係もありません。

トリガー条件:

  • ルート要素 (例: html)

  • 要素はfloated (float は none ではありません)

  • position は絶対または固定です

  • display は inline-block、table-sell、flex...

  • オーバーフローは表示されません

クリーニング用のコンテナ要素疑似要素を設定します (フロートをクリーニングする推奨方法)

推奨学習:《

フロントエンドビデオ

以上がコンテナに複数のフローティング要素が含まれている場合にフロートをクリーンアップする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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