CSS浮动与浮动清除(BFC)简单教程
来源:懂视网
责编:小采
时间:2020-11-27 18:51:58
CSS浮动与浮动清除(BFC)简单教程
CSS浮动与浮动清除(BFC)简单教程:浮动1. 什么是浮动当元素的 float 属性不为 none 时就产生了浮动。<p class="float">float</p>.float { float: left; width: 100px; height: 100px; background-color: #ddd; }2. 浮动
导读CSS浮动与浮动清除(BFC)简单教程:浮动1. 什么是浮动当元素的 float 属性不为 none 时就产生了浮动。<p class="float">float</p>.float { float: left; width: 100px; height: 100px; background-color: #ddd; }2. 浮动
![](https://img.51dongshi.com/20210302/wz/92704452.jpg)
总结来说它要满足下列条件之一:
float
不为 none
position
不为 static
或 relative
display
为 table-cell
、table-caption
、inline-block
、flex
、inline-flex
overflow
不为 visible
只要给父元素加上以上任意一个属性满足条件,也就是给父元素加上 BFC 就能清除子元素的浮动。
声明:本网页内容旨在传播知识,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。TEL:177 7030 7066 E-MAIL:11247931@qq.com
CSS浮动与浮动清除(BFC)简单教程
CSS浮动与浮动清除(BFC)简单教程:浮动1. 什么是浮动当元素的 float 属性不为 none 时就产生了浮动。<p class="float">float</p>.float { float: left; width: 100px; height: 100px; background-color: #ddd; }2. 浮动