浮动元素加上负的margin-top，元素被撑开

 初衷是想实现这样的样式，分为上下结构，下面的盒子设置负的margin-top顶上去，其实设置position也可以，但是相对定位是相对于自己本身的位置进行偏移，所以，下面会留部分的空白。考虑下来，决定采用负的margin-top。

但是实际的效果是这样的↓

 可以看出来，因为浮动的关系，下面盒子的元素跟着上面浮动的元素，尽管上下两个盒子都清除了浮动。这是因为采用的清除浮动方法是↓，

    .clear {
      clear: both;
    }

    .clearfix:after {
      content: "\200B";
      display: block;
      height: 0;
      clear: both;
    }

    .clearfix {
      *zoom: 1;
    }

更改该浮动方法，就可以正常设置负的margin-top了。

    .clearfix {
      content: '';
      display: table;
      clear: both;
    }

别问我原因，今天没心情查原因。