这里的<div style="clear:both"></div>是清除了哪部分浮动？为什么不加会和上部分有空隙

这里的<div style="clear:both"></div>是清除了哪部分浮动？为什么不加会和上部分有空隙

clear:both是清除左浮动和右浮动，由于上面box里面的a和li经行了浮动因此后面的会受到他们的影响照成浮动，目的是清除前面的浮动对后面的影响。
如果不写这个代码可以在子级添加浮动属性之后给父级添加“overflow：hidden”,同样可以清除浮动；

你上面的代码将删除，然后给.box1-1、.box1-2添加overflow：hidden即可清除浮动影响，正常显示
如下图所示

然后你说的中间很大的空白是由于共用边界引起的，可以给h1的父级box2加边框或者添加overflow：hidden即可解决（一般情况是添加overflow：hidden，因为border边框是有颜色的）；

纯手打，望采纳  谢谢！！！