4、外流内浮
网页中所有的包含元素（父元素）以流动模型布局，而其内部含的子元素为浮动模型布局。
元素将根据各自的模型规则进行布局，这时会出现浮动元素（子元素）与流动元素（父元素）分离的现象。
注意：要使流动模型的父元素包含浮动模型布局子元素，则需要就是在浮动子元素下方加上 CSS 的清除定义 clear: both;（如在子元素下方加上区块<divclass="clearbox"></div>），或者是指定父容器（overflow:hidden; ）包含子元素，具体请参阅《清除浮动的一般解决方案》一文。
修改的CSS代码：
#con1, #con2, #con3, #con4 {
overflow:hidden; /* 指定父容器包含子元素 */
}
.class1, .class2, .class3 {
float:left; /* 定义.con2~.con3容器由块级元素转变为内联元素 */
width:45%; /* 定义内联元素的宽度 */
}
提示：您可以先修改部分代码再运行
Copyright © 2003- PowerEasy Yahu All Rights Reserved.
