CSS で float_html/css_WEB-ITnose をクリアします

(1) 空のラベルを使用してフロートをクリアします

これは現在、フロートをクリアするために最も一般的に使用されている方法です。空のタグは div タグまたは P タグです。実際、理論上はどのようなラベルでも構いません。このメソッドは、クリアする必要がある親要素の末尾にフロートをクリアする空のタグを追加します。その CSS コードは clear:both です。この方法は単純明快で便利で実用的ですが、無意味な構造要素が追加されるという欠点もあります。さらに、同じ効果を達成できる同様のメソッド
もあります。

(2) after 疑似オブジェクトを使用してフロートをクリアします

すべてのブラウザは after 疑似オブジェクトをサポートしているため、after は適用できるはずであり、互換性の問題はありません。 CSS コード: #layout:after{display:block;clear:both;content:"";visibility:hidden;}使用時の注意事項: 1. このメソッドは、フローティング要素をクリアする必要がある疑似オブジェクトに height:0 を設定する必要があります。そうしないと、要素は実際の要素よりも数ピクセル高くなります。 2. content 属性が必要です。ですが、その値は空にすることもできます。この方法は、無意味なタグを追加することなく実用的で効果的ですが、CSS コードはより複雑で、十分に簡潔で明確ではありません。

(3) オーバーフロー属性を使用する

このメソッドは、空のラベル要素を通じてフロートをクリアすることで、意図しないコードを追加しなければならないという欠点を効果的に解決します。このメソッドを使用するには、フローティングを解除する必要がある要素で CSS 属性を定義するだけです: overflow:auto;目的は、高さを適応させることです、zoom:1;との互換性のためです。 IE6(ズームはW3C規格に準拠していません)、height:1%;で解決できます。