CSS中创建BFC和解决外边距塌陷

CSS中创建BFC

  • position:fixed/absolute
  • display:inline-block/flex
  • overflow:不为visible
  • float:不为none
    解决外边距塌陷
    ps:块级元素才会发生塌陷
  • 同级元素塌陷
    中间加上同级的空元素,设置空元素的margin值
    设置BFC
  • 父子元素塌陷
    1.边框:给父元素加上border
    2.绝对定位法:给父元素加上position: relative,给子元素加上postion:absolute
    3.行内块级:给子元素设置display:inline-block,前提是子元素要设置宽高
    4.相对定位:给子元素设置position:relative和top(bottom)值,不能设置外边距
    5.浮动:给子元素设置float:left/right
    6.BFC:给父元素设置BFC
    7.内边距:给父元素设置内边距padding

猜你喜欢

转载自blog.csdn.net/weixin_43901550/article/details/107452953