clear属性用于控制元素在浮动元素旁的布局,其值包括none、left、right和both,用于清除左侧、右侧或两侧浮动影响。常通过添加clear: both的元素避免内容环绕浮动元素,解决布局错位。现代方案推荐使用BFC(如overflow: hidden)或伪元素clearfix法替代传统clear,以更优方式处理浮动清除问题。

clear 属性用于控制元素在浮动元素旁边的位置。当一个元素设置了浮动(float),它会脱离正常的文档流,导致后面的元素可能会上移并围绕它排列。使用 clear 可以让某个元素不与前面的浮动元素并排,而是“清除”浮动,从下一行开始显示。
clear 的取值和作用
clear 有以下几个可选值:
- none:默认值,允许元素两边都可以有浮动元素,不做清除处理。
- left:元素的左边不能有浮动元素,会向下移动直到没有左浮动阻碍。
- right:元素的右边不能有浮动元素,会避开右浮动元素。
- both:元素两边都不能有浮动元素,会同时避开左和右的浮动。
常见使用场景
当多个元素依次浮动时,后续非浮动块可能会被挤上去。例如:
这段文字可能会出现在红色方块的右边。
立即学习“前端免费学习笔记(深入)”;
关于Objective下载本文档主要讲述的是关于Objective-C手动内存管理的规则;在ios开发中Objective-C 增加了一些新的东西,包括属性和垃圾回收。那么,我们在学习Objective-C之前,最好应该先了解,从前是什么样的,为什么Objective-C 要增加这些支持。有需要的朋友可以下载看看
在需要结束浮动影响的地方添加一个 clear: both 的元素,可以防止内容环绕。这常用于清除父容器中子元素浮动带来的布局问题。
现代替代方案
虽然 clear 仍有效,但现在更推荐使用其他方式清除浮动,比如:










