感谢阅读本文 · 欢迎在下方留言交流你的想法
探索更多文章 →共 0 条
html<div className="father"> <div className="son"></div> </div>
css.father { display: flow-root; height: 500px; background-color: #f00; margin-top: 100px; } .son { height: 100px; background-color: #0f0; margin-top: 50px; }
例子2
html<div class="blue"></div> <div class="red-outer"> <div class="red-inner">red inner</div> </div>
css
BFC直译为块级格式化上下文,它是一个独立的渲染区域
下面方式会创建BFC
<html>）无副作用的属性
display:flow-root
.blue, .red-inner {
height: 50px;
margin: 10px 0;
}
.blue {
background: blue;
}
.red-outer {
overflow: hidden;
background: red;
}