设置BFC功能及使用的方法是什么
首先BFC是啥？
官方描述：块格式化上下文（Block Formatting Context，BFC）是 Web 页面的可视 CSS 渲染的一部分，是块级盒子的布局过程发生的区域，也是浮动元素与其他元素交互的区域。
额......
是的，正常人看完还是不知道BFC是啥。
我用人类的语言尝试翻译一下：BFC就是一个就是一个容器。只不过这个容器里面元素怎么布局都不会影响外面的元素，外面的元素同样也影响不到这个盒子里面的元素。
不设置BFC会对网页布局有怎么样的影响？
.box1 {
width: 400px;
border: 10px solid pink;
}
.c-box1 {
width: 200px;
height: 200px;
background-color: skyblue;
float: left;
}
.c-box2 {
width: 200px;
height: 200px;
background-color: blueviolet;
float: left;
}
.box2 {
width: 300px;
height: 300px;
background-color: red;
}
