BFC
- 0
#讨论区
00条评论
实时对话
loading...
html
css
例子2
html
css
BFC直译为块级格式化上下文,它是一个独立的渲染区域
下面方式会创建BFC
<html>）无副作用的属性
display:flow-root
<div className="father">
<div className="son"></div>
</div>
.father {
display: flow-root;
height: 500px;
background-color: #f00;
margin-top: 100px;
}
.son {
height: 100px;
background-color: #0f0;
margin-top: 50px;
}
<div class="blue"></div>
<div class="red-outer">
<div class="red-inner">red inner</div>
</div>
.blue, .red-inner {
height: 50px;
margin: 10px 0;
}
.blue {
background: blue;
}
.red-outer {
overflow: hidden;
background: red;
}