<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>CSS清除浮动-after伪元素</title><style>.clearfix:after{content: "";display: block;height: 0 ;clear:both;visibility: hidden;}.clearfix{*zoom: 1;}.box{width: 800px;margin:0 auto;background-color:pink;border:1px solid red;}.zzf1{float: left;width: 200px;height: 200px;background-color:blue;}.zzf2{float: left;width: 200px;height: 200px;background-color:yellow ;}.zzf3{float: left;width: 200px;height: 200px;background-color:blue;}.zzf4{float: left;width: 200px;height: 200px;background-color:yellow ;}.zzf5{float: left;width: 200px;height: 200px;background-color:red ;}</style></head><body><div class="box clearfix"><div class="zzf1"></div><div class="zzf2"></div><div class="zzf3"></div><div class="zzf4"></div><div class="zzf5"></div></div></body></html>width: 200px;height: 200px;background-color:red ;}</style></head><body><div class="box"><div class="zzf1"></div><div class="zzf2"></div><div class="zzf3"></div><div class="zzf4"></div><div class="zzf5"></div></div></body></html>
