清除浮動是每一個 web前臺設計師必須掌握的機能。css清除浮動大全,共8種方法。 

浮動會使當前標簽產(chǎn)生向上浮的效果,同時會影響到前后標簽、父級標簽的位置及 width height 屬性。而且同樣的代碼,在各種瀏覽器中顯示效果也有可能不相同,這樣讓清除浮動更難了。解決浮動引起的問題有多種方法,但有些方法在瀏覽器兼容性方面還有問題。 

1,父級div定義 height 

大學生就業(yè)培訓,高中生培訓,在職人員轉(zhuǎn)行培訓,企業(yè)團訓

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
            .div1 { background: #000080; border: 1px solid red; /*解決代碼*/ height: 200px; } 
            .div2 { background: #800080; border: 1px solid red; height: 100px; margin-top: 10px} 
            .left { float: left; width: 20%; height: 200px; background: #DDD } 
            .right { float: right; width: 30%; height: 80px; background: #DDD }

            </style>
    </head>

    <body>
        <div class="div1">
            <div class="left">Left</div>
            <div class=&q