2019-05-30课堂随记

①高度塌陷

答辩题：  1.父元素的垂直外边距不会和子元素重叠

2.开启BFC的元素不会被浮动元素覆盖

3.开启BFC的元素可以包含浮动的子元素

如何开启：

1.设置元素浮动

2设置元素绝对定位

2.设置元素为inline-block

4.将元素的overfoflow设置为一个非visible

IE6以下浏览器不支持BFC

hasLayout

zoom:1;

②清除浮动

clear：left  清除左浮动

          right 清除右浮动

          both  清除影响最大的浮动（可以解决高度塌陷的问题）

用.clearfix：after{

      content：‘插入一个空元素’

      display：block  将内联元素转成块元素

      clear：both 清除浮动}  也可以解决塌陷

.clearfix{

zoom：1；

}  可以使上述代码支持IE6

③定位position

static：静态的 无定位 忽略方向申明

relative：相对定位，不设置偏移量的情况下精致不动；设置left：100 就是距离左边100px 相当               于向右移动100px，是相对于自己原来的位置定位的；相对定位的元素不会脱离文

                      档流，但是比文档高一级

absolute：绝对定位只要开启就会脱离文档流，如果没有设置偏移量元素会静止不动 他是相对于离自己最近的并且开启了定位的祖先来定位的

fixed：固定定位  开启也会脱离文档流  固定定位大多数和绝对定位相同  但是不会根据离自己最近并且开启了定位的祖先来定位  他永远会根据浏览器原点来定位