フロートをクリアするいくつかの方法

今回は、フロートをクリアするためのいくつかの方法と、フロートをクリアするための注意事項を紹介します。以下に実際のケースを示しますので、一緒に見てみましょう。

html

    <p>
        <p class=&#39;box-left&#39;></p>
        <p class=&#39;box-right&#39;></p>
    </p>

css

.box-left,.box-right{
        width:200px;
        height:200px;
        float: left;
        background: red;
        border:1px solid #333;
    }

最初の方法: .box{clear:box}

2番目の方法: .box{overflow:hidden}

3メソッド: . box{overflow:auto}

4 番目のメソッド: .box:after{ content:""; height:0; display:block; 1;}5番目の方法: .box{height:200px} Set height

6番目の方法: .box{display:table}

この記事を読んだはずですあなたはケースメソッドをマスターしました. さらに興味深い情報については、php 中国語 Web サイトの他の関連記事にご注目ください。 推奨読書:

CSSで赤いハートを描く

表示と可視性の違い

CSSでフッターの下部配置を実装するいくつかの方法

以上がフロートをクリアするいくつかの方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。