效果如上。要注意其实需要浮动的只有绿色蓝色以及黄色的部分,其他三个div标签是不需要浮动的。
解决浮动问题有两种方法
1:在四号框浮动之后,使用clear属性来清除浮动。
</div>
<!--设置清除器-->
<div class="class2"></div>
.class2{
clear: both;
}
2 将2、3、4当成一个整体。每次进行浮动操作之后需要将浮动过的div使用更高级别的div框起来
<body>
<div id=a1>1</div>
<div class="class3">
<!--<div class="class1">-->
<div id=a2>2</div>
<div id=a3>3</div>
<div id=a4>4</div>
<!--</div>-->
</div>
<div id=a5>5</div>
<div id=a6>6</div>
</body>
结果同上