什么是浮动以及浮动的清除方法
时间：2024/3/5作者：未知来源：争怎路由网人气：
- 网页的本质就是超级文本标记语言，通过结合使用其他的Web技术（如：脚本语言、公共网关接口、组件等），可以创造出功能强大的网页。因而，超级文本标记语言是万维网（Web）编程的基础，也就是说万维网是建立在超文本基础之上的。超级文本标记语言之所以称为超文本标记语言，是因为文本中包含了所谓“超级链接”点。
本章给大家介绍什么是浮动以及浮动的清除方法。有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。
一、浮动
说浮动就必须提及一下文档流，HTML当中的元素按照从左到右，从上到下的顺序进行排列称之为文档流，也就是正常排列。
而浮动是什么呢？浮动会让元素脱离文档流，假如A元素浮动了，原本排在该元素之后的元素发现A元素不在这个文档流了，就会无视它往上接到A元素前面的元素之后(PS:但是文字并不会无视它，还会环绕A元素，也就是A元素没有脱离文字流。
而如果使用position的绝对定位会连文字流也脱离文档流。
浮动的好处当然是布局了，例如通过浮动来形成三列布局，文字环绕等等。但是浮动也有一个问题，那就是会导致高度的塌陷，就像上面的图片显示，父元素的高度塌陷了，并没有将浮动的子元素包裹进去，这样子就会造成布局上的错误。
二、BFC
什么是BFC？BFC是Block Formatting Context的缩写，也就是块级格式化上下文，创建BFC有以下情况：
float的值不为none。
overflow的值不为visible。
display的值为table-cell, table-caption, inline-block中的任何一个。
position的值不为relative和static。
BFC的特性就是包裹浮动的元素。按照我的理解，当你创建BFC之后元素就会把里面的东西视为自己的东西，包括浮动元素，然后创建一个私有领域给包裹进来。此外BFC还有还有如下特性。
1.让原本会叠加的上下外边距叠加无效。将想要边距失效的两个盒子分别放入一个父盒子，然后为父盒子创建BFC。
2.创建BFC的元素将不会围绕浮动元素，图中文字用p标签包裹并创建BFC，右上角浮动元素，可以看见文字并没有环绕浮动元素。
三、 清除浮动的方法
清除浮动方法大致有两类，一类是clear:both
关键词：啥是浮动以及浮动的清除办法