css浮动——2017.3.1

版心的概念

版心就是，网 站的核心展示区域，一般居中显示。版心宽度一般是：960px、1000px

清除浮动，就是让当前元素左右两边都不在浮动元素都不存在浮动元素的时候才把元素放到标准流汇总

clear: both;

清除浮动

常用四种清除浮动的方法：

方法一：使用空标记清除浮动，隔墙放，增加标签

方法二：使用overflow属性清除浮动。会误伤

方法三：使用after伪对象清除浮动。

方法四：使用before after伪对象清除浮动

clearfix 整体清除浮动方案

使用场景：

1、父盒子要所有的子盒子包裹住

2、父盒子是包裹正行的div元素，需要前后进行清除浮动

<style>

          *{ padding: 0px; margin: 0; }

          .header, .aside, .main, .footer{

               border: 1px solid yellow; /*bd + tab*/

               background-color: silver;

               margin-bottom: 10px;

               height: 200px;

          }

          .aside{

               height: 300px;

               float: left;

               width: 200px;

          }

          .main{

               float: left;

               /*margin-left: 202px;*/

               width: 980px;

          }

          .clearfix{

               display: table; /*触发bfc,div具有的包裹性*/

          }

          .clearfix:before,.clearfix:after{

               content: "";

               display: block;

               clear: both;

               height: 0;

               visibility: hidden;

          }

          .clearfix{

               _zoom: 1;

          }

     </style>