浮动与清除浮动

在这里插入图片描述
在前端的页面布局中,我们经常会用到浮动,对于新手来说,它是个很实用的属性,它可以将块级元素堆叠在一起,也可以把他们并排显示。在这里插入图片描述
此时,我们给第二个元素设置浮动,代码如下在这里插入图片描述
然后,我们看下他的效果
在这里插入图片描述
因为我给b设置了浮动,就相当于b飘了起来,然后c就顺理成章的跑到b的下面去了
这个就是堆叠
那么如果三个我都设置浮动,会出现什么情况呢,下面就是它的代码在这里插入图片描述
在这里插入图片描述
看到没有,他们并排显示了哇
同时,浮动在响应式里面也能用
在这里插入图片描述在这里插入图片描述
但是在一些特殊情况下,我们是不要浮动的,但改变浮动的话,格式有可能会乱,所以我们
就要清除它的浮动了
下面我给c设置了清除浮动
在这里插入图片描述
看下它的效果在这里插入图片描述
原本三个是并排的,现在c已经离家出走了
Clear还有一些其他定义,一起来看下吧
在这里插入图片描述 希望对大家有用。