clearfix(清除浮动),同时解决高度塌陷和外边距重叠问题
clearfix介绍
利用
clearfix
(清除浮动)可以解决垂直外边距重叠问题(也可解决高度塌陷问题)
clearfix最终代码示例:
.clearfix::before,
.clearfix::after{
content:'';
display:block;
clear:both;
}
注:
.clearfix::before{
content'';
display:table;
} `此部分代码解决外边距重叠问题`
.clearfix::after{
content'';
display:table;
//display:table既可以解决高度塌陷又可以解决外边距重叠
//display:block只能解决高度塌陷,不能解决外边距重叠
clear:both;
} `此部分代码解决高度塌陷问题`