我們?cè)诰W(wǎng)頁(yè)中經(jīng)??吹礁?dòng)的圖象和表格,只需對(duì)一個(gè)<IMG>標(biāo)簽使用ALIGN=left屬性,文字就會(huì)繞到浮動(dòng)圖象的右邊繼續(xù)顯示。樣式表對(duì)于浮動(dòng)要素有一個(gè)更為靈活的語(yǔ)法,也就是本篇中將要談到的主題。
(IE3和IE 4不支持本頁(yè)中談到的任何功能。如果你使用IE 4,你將會(huì)看到一些奇怪的格式。)
浮動(dòng)
浮動(dòng)屬性使你能將一個(gè)要素周?chē)梦淖职?,不僅僅是包裹圖象,而且能包裹整塊的文字。
H4 { float: left }
你可以看到這項(xiàng)CSS規(guī)則應(yīng)用于<H4>的文字。而本段內(nèi)容則包裹在標(biāo)題文字的右下邊,就象是用文字包裹圖象時(shí)的效果那樣。你也可以使用向右浮動(dòng)的參數(shù)值。
如果浮動(dòng)要素周?chē)倪吘嗵?,你可以使用之前學(xué)過(guò)的空格填充屬性給它加大四周的空間(但似乎使用邊距會(huì)造成問(wèn)題)。
清除
如果你想使一段文字包裹某一要素,而下一段文字不包裹,你可以使用clear屬性,很象HTML的CLEAR屬性的用法(例:
CLEAR=right)。
P { clear: left }
例:
第1、2段文字包裹了向左浮動(dòng)的第1幅圖象。
而使用了清除(clear)屬性后,第4、5段文字中只有第4段包裹了圖象,而第5段文字沒(méi)有包裹。
更多建議: