CSS
1. 介绍BFC及其应用
BFC的全称是block format context, 块级格式化上下文,简单点就是结界,如果一个元素具有了BFC功能了,内部元素不管怎么翻江倒海都不能影响外部,所以什么浮动导致高度塌陷, margin重叠等问题都不会出现
触发BFC的条件:
- <html>的根元素
- float不为none的元素
- overflow 为 hidden, auto ,scroll的值
- position不为releative和static的定位
- display为table-cell,table-caption和inline-block,flex、inline-flex的一种
BFC作用 - 清楚浮动,因为被BFC包裹的元素是结界,自然浮动不能对外部产生影响
- 同一BFC元素间的外边距margin重叠的问题