關於html中,巢狀多個盒子浮動的問題。
//貼上程式碼
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <style> .box1{ width:300px; height:300px; background-color: red; } .box2{ float:right; width: 200px; height:200px; background-color: green; } .box3{ width:100px; height:100px; background-color: blue; } </style> </head> <body> <div class="box1"> <div class="box2"> <div class="box3"> </div> </div> </div> </body> </html>
結果如圖所示
/*由此得出結論,當給box2設定右浮動時,box2裡面的box3盒子並不會繼承浮動屬性*/