css浮动与清除浮动

概念

常规流(文档流)
包含块
脱离常规流
浮动元素处于流内和流外
浮动流不影响块级元素的布局(当浮动元素不存在)
浮动元素会影响行内元素的布局(从而间接影响块级元素的布局)
static
浮动与定位不能一起用
如果一起使用,浮动会失效,定位生效
块级元素会当浮动元素不存在,行内元素会撑开块元素

块级元素清除浮动clear

clear: none | left | right | both;
.clearfix{
overflow:hidden;
}
(闭合浮动)
a{
display:inline-block;
width:100%;
}
a{
display:block;
clear:both;
}
BFC{作用域}

div 父
{
display:table;
display:table-ceil;
display:flow-root;
}
{
float:left;
}
伪类
div::after{
content:'';
display:block;
clear:both;

}

你可能感兴趣的:(css浮动与清除浮动)