CSS清除浮动
2021-01-02 11:27
标签：手动 缺点 浏览器 超过 代码 解决 overflow 出现 默认 浮动是布局的时用到的一种技术，能够方便我们进行布局。
1、浮动的设置：css属性float：left/right/none 左浮动/右浮动/不浮动（默认）
2、浮动的原理：使当前元素脱离普通流，相当于浮动起来一样，浮动的框可以左右移动，直至它的外边缘遇到包含框或者另一个浮动框的边缘
3、浮动的影响：对附近的元素布局造成改变，使得布局混乱因为浮动元素脱离了普通流，会出现一种高度坍塌的现象：原来的父容器高度是内部元素撑开的，但是当内部元素浮动后，脱离普通流浮动起来，那父容器的高度就坍塌，变为高度0px。 清除浮动的方法:
1.给父级div定义overflow:hidden
原理：使用overflow时，浏览器会自动检查浮动区域的高度。
优点：代码使用少，容易编写
2.给父级div定义height
原理：父级div手动定义height，就解决了父级div无法自动获取到高度的问题。
优点：简单，代码少，容易掌握。
缺点：只适合高度固定的布局，要给出精确的高度，如果高度和父级div不一样时，会产生问题。
3.给父级div定义overflow:auto
原理：使用overflow:auto时，浏览器会自动检查浮动区域的高度。
优点：简单，代码少，浏览器支持好。
缺点：内部宽高超过父级div时，会出现滚动条。 CSS清除浮动 标签：手动 缺点 浏览器 超过 代码 解决 overflow 出现 默认 原文地址：https://www.cnblogs.com/axingya/p/13666741.html
下一篇：Auto.js常用控件整理