三.overflow 内容溢出容器时的处理方式

三.overflow 内容溢出容器时的处理方式

visible可见的 hidden隐藏 scroll出现滚动条 auto内容溢出才出现滚动条

设置某个方向：overflow-x 水平方向 overflow-y垂直方向

当某一个方向的值不为visible，另一个方向的值会自动设置为auto

备注:隐藏元素的两种方式

1.display：none；隐藏元素，不占位置

2.visibility：hidden；隐藏元素，占位置

overflow的应用场景：

1.高度塌陷，子元素都浮动了，父元素会没有高度。

清除高度塌陷：给父元素加overflow：hidden；

2.margin：给父元素的第一个子元素加margin-top，会错误的渲染到父元素上

解决办法：给父元素加overflow：hidden；

3. 自适应两栏布局：某一边定宽浮动时，另一边不定宽overflow：hidden；