1.什么是浮动
1.什么是浮动
浮动就是让块级标签不独占一行。目的(使用场景):把块级标签元素可以排在一行上
2、浮动的原理
就是让元素脱离文档流,不占用标准
3、浮动后,不管是后面的块级元素还是行级元素不会显示在下一行
4、清除浮动
目的:让后面的元素自动掉到下一行
方法:
1)添加空标签,并设置样式:clear:both;
clear:left 清除左浮动
clear:right 清除右浮动
clear:both 清除左右浮动
clear:none 左右浮动都不清除
2)在要清除浮动的父级添加样式:overflow:hidden
overflow:hidden;超出部分隐藏,也可以用来实现清除浮动
3)在要清除浮动的父级添加伪元素,并设定样式:
父元素:afte{
content:“ ”;
display:block;
clear:both;
}