CSS浮动（如果想知道CSS有关浮动的知识点，那么只看这一篇就足够了！）
CSS 浮动（Float）是一种布局方式，用于创建多列布局。浮动元素会尽量向左或向右对齐，直到它的外边缘碰到包含框或另一个浮动元素的边框为止。
浮动可以用于创建文字环绕图片的效果，或者用于创建传统的列布局。
浮动的属性值：
float: none;：不浮动，默认值。float: left;：向左浮动。float: right;：向右浮动。
清除浮动的方法：
- 使用
clear属性：clear: both;会创建一个块级格式化上下文，清除前面的浮动元素。 - 使用伪元素清除法：
.clearfix::after { content: ""; display: table; clear: both; } - 使用
overflow属性：overflow: auto;或overflow: hidden;也可以清除子元素的浮动。
示例代码：
/* 向左浮动 */
.float-left {
float: left;
}
/* 清除浮动 */
.clearfix::after {
content: "";
display: table;
clear: both;
}
<!-- 浮动元素 -->
<div class="float-left">我向左浮动</div>
<!-- 清除浮动 -->
<div class="clearfix">我清除了前面的浮动</div>
评论已关闭