完善clearfix(高度塌陷，边距重叠)-原创手记-慕课网

               /*
               * 子元素和父元素相邻的垂直外边距会发生重叠，子元素的外边距会传递给父元素
               * 使用空的table标签可以隔离父子元素的外边距，阻止外边距的重叠

           /**
           * 解决父子元素的外边距重叠
           */
           /*.box1:before{
               content: "";*/
               /*
               * display:table可以将一个元素设置为表格显示
               */
           /*   display: table;
           }
           */

           /**
           * 解决父元素高度塌陷
           */
           /*.clearfix:after{
               content: "";
               display: block;
               clear: both;
           }*/

           /*
           * 经过修改后的clearfix是一个多功能的
           *    既可以解决高度塌陷，又可以确保父元素和子元素的垂直外边距不会重叠
           */
           .clearfix:before,
           .clearfix:after{
               content: "";
               display: table;
               clear: both;
           }

           .clearfix{
               zoom: 1;
           }