質問: これはページ レイアウトです。現在の問題は、メインで高さ属性を削除すると、再実行後にページの下部にある青い背景のレイアウトが消えることです。これは何が原因ですか? コードは次のとおりです: <br> #header{width: 1300px;height: 180px;background-color: red;} <br> #main{width: 1300px;height: 600px ;background-color: green;} <br> #footer{width: 1300px;height: 180px;background-color: blue;} <br> #sleft{width: 900px;height: 600px;background-color: yellow;float: left;} <br> #sright {幅: 400px;高さ: 600px;背景色: ピンク;float: right;} <br> </head> <br> <div id="header"> ;</div> <br> <div id="sleft"></div> </ div> <br> <div id="footer"></div> ; /css"> <br> #header{幅: 1300px;高さ: 180px;背景色: 赤;} <br> #main {幅: 1300px;背景色: 緑;オーバーフロー:非表示;} <br> #footer{幅: 1300px;高さ: 180px;背景色: ブルー;} <br> #sleft{幅: 900px;高さ: 600px;背景色: yellow;float: left;} <br> #sright{width: 400px;height: 600px;background-color : ピンク;float: right;} <br> </head> ;div id="ヘッダー"></div> <br> <div id="メイン" > <div id="左"></div> </p> <p> <div id="右" ></div> </p> </div> ;</div> </html> <br> 背景色: green;overflow:hidden;} <h2> ここに overflow:hidden を追加します </h2> <p class="sougouAnswer"> #footer { <br> width: 1300px; <br> height: 180px; <br> plus Clear : 両方; float をクリアします <br> <br> 正解は 3 階にあります <br> <br> float 属性はこの要素を引き起こし、通常のドキュメント フローを削除します。つまり、ブラウザは描画時にこの要素を存在しないものとして扱います。他の要素。 <br> 考えてみてください。main の要素が存在しなくなり、main に高さがなくなったらどうなるでしょうか?フッターが上に移動します！ <br> <br> 次に、ブラウザーは追加の float 要素を描画するため、フッターはこれら 2 つの要素によって隠されます。 <br> <br> さらに: <br> 絶対および固定配置メソッドも要素を通常のドキュメント フローから移動させます <br> <br> 3 正しくありませんか? <br> rree の最後にフロートをクリアする必要があります </p> なぜ追加するのでしょうか?オーバーフロー:メインに隠されている、それだけですか?理由はまだわかりません <p class="sougouAnswer"> <br> DIV の hasLayout をトリガーしてレイアウト フローに戻すことができる属性であれば、その表示を設定するなど、この問題を解決できます </p> <p class="sougouAnswer"> なぜこの問題が発生するのかわかる人はいますか?自分？ <br> <br> http://beyondweb.cn/article_detail.php?id=437 <br> <br> わかりました、ありがとう 10 階、slwss ポイントをいただきました <br></p>
