1. Definition

BFC： Block formatting context （Block Formatting Context）

• yes Web Visualization of the page CSS Part of the rendering , It's a box Layout process Where it happened , It's also the area where floating elements interact with other elements .
   

2. How to make elements （ The box ） become BFC The box

①html The label is BFC The box

② Floating elements are also BFC The box

③ Inline block elements are also BFC The box

④overflow Property value is not visivle. Such as auto、hidden

⑤.......

3.BFC Characteristics of the box

① BFC The box will wrap the inner sub elements by default ( Standard flow 、 float )→ application : Remove the floating

② BFC There is no connection between the box itself and the child elements margin The collapse of → application : solve margin Collapse of

③........
 

Case explanation and reference ：

What is? BFC？ Just read this one _Leon_94 The blog of -CSDN Blog _bfc