使用:after 偽元素
需要注意的是 :after是偽元素（http://www.w3.org/TR/selectors/#pseudo-elements），不是偽類（某些CSS手冊(cè)里面稱之為“偽對(duì)象”），很多清除浮動(dòng)大全之類的文章都稱之為偽類溃蔫，不過(guò)csser要嚴(yán)謹(jǐn)一點(diǎn)雳窟，這是一種態(tài)度腋寨。
由于IE6-7不支持:after咕娄，使用 zoom:1觸發(fā) hasLayout坠敷。
該方法源自于:http://www.positioniseverything.net/easyclearing.html
原文全部代碼如下:
拘鞋。砚蓬。。盆色。灰蛙。。
? .clearfix:after {? content: "."; display: block; height: 0; clear: both; visibility: hidden;? }? .clearfix {display: inline-block;}? /* for IE/Mac */? .clearfix {zoom: 1;/* triggers hasLayout */? display: block;/* resets display for IE/Win */} ? ? 鑒于 IE/Mac的市場(chǎng)占有率極低,我們直接忽略掉,最后精簡(jiǎn)的代碼如下:
.clearfix:after {content:"."; display:block; height:0; visibility:hidden; clear:both; }
.clearfix { *zoom:1; }
