DIV+CSS clear both清除产生浮动

来源：互联网发布：打色子软件编辑：程序博客网时间：2024/04/30 13:52

1、clear语法：
clear : none | left|right| both

2、clear参数值说明：
none : 　允许两边都可以有浮动对象
both : 　不允许有浮动对象
left : 　不允许左边有浮动对象
right : 　不允许右边有浮动对象

3、clear解释：
该属性的值指出了不允许有浮动对象的边情况，又对象左边不允许有浮动、右边不允许有浮动、不允许有浮动对象。

4、css结构
div{clear:left}
div{clear:right}
div{clear:both}

我们常常用于使用了float css样式后产生浮动，最常用是使用clear:both清除浮动。比如一个大对象内有2个小对象使用了css float样式为了避免产生浮动，大对象背景或边框不能正确显示，这个时候我们就需要clear:both清除浮动。

<!DOCTYPE html><html><head><title>DIV+CSS clear both清除产生浮动</title><style type="text/css">    .divcss5{width:500px;background:#000;border:1px solid #F00;padding:10px}     .divcss5_left,.divcss5_right{ border:1px solid #FFF;background:#999;width:200px;height:150px}         .divcss5_left{ float:left}/*   设置浮动靠左 */     .divcss5_right{ float:right}/* 设置浮动靠右 */ .clear{ clear:both} </style></head><body><div class="divcss5"> <div class="divcss5_left">float left盒子</div> <div class="divcss5_right">float right盒子</div> <div class="clear"></div> </div></div></body></html>

0 0