1，定义
1，BFC演示1
代码演示
<style>*{margin: 0;padding: 0;}body{/* display: flex; */}.outer{width: 400px;background-color: #888;/* float: left; *//* position: absolute; *//* display: inline-block; *//* display: table; *//* overflow: auto; *//* column-count: 1; */display: flow-root;}.inner{width: 100px;height: 100px;margin: 20px;}.inner1{background-color: red;}.inner2{background-color: orange;}.inner3{background-color: yellow;}</style>
</head>
<body><div class="outer"><div class="inner inner1"></div><div class="inner inner2"></div><div class="inner inner3"></div></div>
</body>2，BFC演示2
代码演示
<style>.box{width: 100px;height: 100px;}.box1{background-color: orange;float: left;}.box2{background-color: green;/* float: left; *//* position: absolute; *//* display: inline-block; *//* display: table; *//* overflow: auto; *//* column-count: 1; */}</style>
</head>
<body><div class="box box1"></div><div class="box box2"></div>
</body>3，BFC演示3
代码演示
<style>.outer{width: 400px;background-color: gray;/* float: left; *//* position: absolute; *//* display: inline-block; *//* display: table; *//* overflow: auto; *//* column-count: 1; */}.box{width: 100px;height: 100px;float: left;}.box1{background-color: orange;}.box2{background-color: green;}</style>
</head>
<body><div class="outer"><div class="box box1"></div><div class="box box2"></div></div>
</body>4，学习路线
