【2】CSS-塊狀元素與內嵌元素

在前面例子中，為了達到瀏覽器安全色性，我們分別在紅色藍色方塊CSS 代碼中分別加了“Float:left;”，這樣IE 和FF 中顯示效果一樣，如果此時我們還想放一個寬度400 像素，
高度100 的綠色方塊，並讓其處於第二行，效果如：

可是這時候不管怎麼放，在IE 中的效果始終是：

導致綠色拍到藍色的後面這種情況就是因為藍色方塊CSS 代碼中含有"Float:left;"，但是為了瀏覽器安全色性，又不能去掉(什嗎？這句話看不明白，只能說明第二節課你沒有好好學，好好品味！)，怎麼辦？好辦~！只要在CSS 代碼中加入下面這段代碼：

.clear{clear:both;}

並在HTML 程式碼中加入下面代碼：

<div class="clear"></div>

上面這句話究竟加在那個位置呢，要加在藍色方塊和綠色方塊中間，然後看看效果是不是我們想要的了~^_^

<div id="redBlock">部落格的左側</div>
<div id="blueBlock">部落格的右側</div>
<div class="clear"></div>
<div id="greenBlock">部落格的著作權資訊</div>

目的就是為了清除藍色方塊的浮動對下面綠色方塊的影響！是影響喲~是清除影響，而不是清楚藍色方塊的浮動，或者說清除藍色方塊的浮動對下面地區塊產生的作用！（仔細品品我說的這句話！）