css 清除浮动

<style>
    .clear{
        clear:both;
    }
    .f-left{
        float:left;
    }
</style>

<div class="outer">
    <div class="div1 f-left">1</div>
    <div class="div2 f-left">2</div>
    <div class="div3 f-left">3</div>
    <div class="clear"></div>
</div>

<style>
    .over-flow{
        overflow:hidden;
    }
</style>

<div class="outer over-flow"> //这里添加了一个class
    <div class="div1 f-left">1</div>
    <div class="div2 f-left">2</div>
    <div class="div3 f-left">3</div>
</div>

<style>
.clearfix:after {
  content: ‘.‘;
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}
.clearfix {
  zoom: 1; /*主要兼容IE*/
}
</style>

<div class="div1 clearfix"> 
     <div class="left">Left</div> 
      <div class="right">Right</div> 
</div>