2020.0331知识总结

知识总结

• 高度自适应：**
  一、高度自适应的第一种情况：(内容撑开父元素高度)
  1：高度不去设置，或者高度设置成auto，内容会把父元素高度撑开。
  2：内容撑开父元素最小高度：最小高度值的设置（min-height：；）
  3：浮动元素添加高度自适应：添加浮动元素的父元素没有高度，会出现高度坍塌。
  4：高度坍塌解决方案：
  （1）：添加overflow：hidden；
  原理：触发BFC
  弊端：隐藏掉定位在元素外面的内容。
  （2）给浮动的元素下放添加一个空的div标签，并且设置样式（clear：both；）
  原理：clear：both；忽略上方浮动元素留出的空间（闭合浮动）
  （3）万能清除法：
  .clear_fix:after{
  Content:””;
  Clear:both;
  Display:block;
  Height:0;
  Overflow:hidden;
  Visibility:hidden;
  }
  .clear_fix{
  Zoom:1;
  }
  二、高度自适应第二种情况：（让子元素高度随着父元素高度进行改变）
  需求：让一个元素在浏览器窗口完全铺满。
  前提条件：body，html{
  Height：100%
  }