CSS---浮动造成的影响

1.浮动

①设置浮动的元素不占用空间；

②设置浮动的元素层级高于普通元素，也就是说会覆盖其他元素；

③在同一行中的元素要横向排列，将元素都添加浮动属性，float:left; 向左浮动，float:right;向右浮动;

④只有块级元素才能设置宽和高，行内元素没有宽和高，行内元素的宽和高是有内容决定的，无论之前是否是块级元素，设置浮动后一定是块级元素；

⑤盒子设置浮动属性后不属于正常的文档流；

2.清除浮动

如果父盒子没有设置固定高度，而子盒子设置了浮动，父盒子将会受到影响无法正常计算，如何让父盒子得到一个自然高度：

方法①：在父盒子里面的最下面添加一个空盒子，<div style="clear:both;"></div>；

方法②：解决浏览器的bug，在父盒子的样式中添加一条样式，overflow:hidden;