Jason zeng practice

2019-08-09  本文已影响0人  Jason_Zeng

CSS

1. 介绍BFC及其应用

BFC的全称是block format context, 块级格式化上下文,简单点就是结界,如果一个元素具有了BFC功能了,内部元素不管怎么翻江倒海都不能影响外部,所以什么浮动导致高度塌陷, margin重叠等问题都不会出现
触发BFC的条件:

  1. <html>的根元素
  2. float不为none的元素
  3. overflow 为 hidden, auto ,scroll的值
  4. position不为releative和static的定位
  5. display为table-cell,table-caption和inline-block,flex、inline-flex的一种
    BFC作用
  6. 清楚浮动,因为被BFC包裹的元素是结界,自然浮动不能对外部产生影响
  7. 同一BFC元素间的外边距margin重叠的问题
上一篇 下一篇

猜你喜欢

热点阅读