先說(shuō)原理：這種方法清除浮動(dòng)是現(xiàn)在網(wǎng)上最拉風(fēng)的一種清除浮動(dòng)，他就是利用:after和:before來(lái)在元素內(nèi)部插入兩個(gè)元素塊，從面達(dá)到清除浮動(dòng)的效果。其實(shí)現(xiàn)原理類(lèi)似于clear:both方法，只是區(qū)別在于:clear在html插入一個(gè)div.clear標(biāo)簽，而outer利用其偽類(lèi)clear:after在元素內(nèi)部增加一個(gè)類(lèi)似于div.clear的效果。下面來(lái)看看其具體的使用方法：

. box{ zoom:1;} ? /***for IE6/7***/

. box:after{ clear: both; content: '.' ; display:block; width: 0; height: 0; visibility: hidden;}

其中clear:both;指清除所有浮動(dòng)；content: '.'; display:block;對(duì)于FF/chrome/opera/IE8不能缺少，其中content（）可以取值也可以為空。visibility:hidden;的作用是允許瀏覽器渲染它，但是不顯示出來(lái)，這樣才能實(shí)現(xiàn)清楚浮動(dòng)。

下一標(biāo)簽直接清浮動(dòng)兄弟標(biāo)簽浮動(dòng)時(shí)，在下一標(biāo)簽的屬性中直接寫(xiě)入清除clear:both;這樣就可以清除以上標(biāo)簽的浮動(dòng)而不用加入空標(biāo)簽來(lái)清除浮動(dòng)。