为父级元素 添加 .clearfix 类可以很容易地清除内部的浮动。还可以作为 mixin 使用
<div class="clearfix">...</div>
引用该 mixin 的源码
@mixin clearfix() {
&::after {
display: block;
clear: both;
content: "";
}
}
在 SCSS 中作为 mixin 使用:
.element { @include clearfix;}
.clearfix 的用法: 如果没有 .clearfix ,父级<div>
元素是无法覆盖住两个按钮的,从而导致布局被破坏。