両方の理解と使用法のエラー：明確なCSSの

2016年チュアンカイポッドキャストウェブ教育ビデオは、明確について話しました：両方がフローティングの使用を削除します

<！DOCTYPE HTML > 
< HTML > 
    < ヘッド> 
        < メタ文字コード= "UTF-8" > 
        < タイトル> </ タイトル> 
        < スタイル> 
            ＃のDIV1 { 
                幅：500pxなど。
                高さ：300ピクセル; 
                国境：1pxの固体赤。
                フロート：左; 
                
            } 
            ＃1 DIV2 { 
                幅：500pxなど; 
                高さ：300ピクセル; 
                国境：1pxの黒一色。
            } 
            ＃1 DIV3 { 
                幅：500pxなど。
                高さ：300ピクセル; 
                国境：1pxのソリッドピンク。
            } 
            ＃1 DIV0 { 
                
                クリア：両方。
            } 
        </ スタイル> 
    </ ヘッド> 
    < 身体> 
        
        < div要素ID = "DIV1" > </ divの> 
        
        < DIV ID = "DIV2" > </ divの> 
        <！ - <のdivのid = "DIV0"> </ div> - > 
        < divのID = "DIV3" > < / DIV > 
    </ ボディ> 
</ HTML >

彼の意図は、フローティングないDIV2とDIV3 DIV1に影響を与えることがあるが、彼は財産の上に浮かぶプラス財産のリードでDIV1が有効ではありません、理由は次のとおりです。

所定の内部CSS文書  平均両方：側から任意のフローティングフレームの前にソースドキュメントで発生底外縁の下に必要なトップボーダーフレーム明確。

だから、明らかがあります：両方のプロパティの要素がフロートの上に浮いた後、明確な役割を担うことができます。

以下のために  clear 財産を念頭に置かなければなりません。

clearそれだけで浮動要素の前にクリアすることができます。 
「要素の明確なだけでクリアした文書のためにその前に山車を。それはそれの後に明確な山車をしません。」

クリアフロート方法が多くありますが、最も一般的な、そして最もひとつは最適化されている擬似要素の使用：

  親：{後に
        クリア：両方。
        表示ブロック; 
        コンテンツ：""; 
    }