浮动的特点:
(1)浮动只有左浮动和右浮动
(2)浮动的元素会向右或者向左移动直到碰到父元素边际或者上一个浮动元素的边际为止
(3)浮动的元素会脱离文档流,不在占据物理空间,后面不浮动的元素会占据浮动元素的位置,不浮动元素的文字将避开浮动的元素形成文字环绕
(4)相邻的浮动的元素可以并成一行,超过父级元素的宽度会自动换行
(5)父类元素如果子元素全部浮动将无法撑开宽度,需要用到清除浮动
解决父类元素宽度无法撑开:
(1)给父类元素设置相应的宽高
(2)给父元素设置属性overflow:hidden
(3)使用一个与父元素并列的空的div并为其设置样式:clear:both,清除浮动的影响
(4)使用伪元素:
父元素选择器:after{
content:"";
display:table;
clear:both;
}