clear
clearプロパティの役割
clearプロパティは、floatプロパティによってフロート指定された要素に続く要素の回り込みを解除します。
clearプロパティに設定できる値
both | フロートをすべて解除。 |
left | 左フロートを解除。 |
none | 解除なし。初期値。 |
right | 右フロートを解除。 |
clearプロパティの使い方
<div style="float:left;width:50px;height:50px;background-color:#FF0000"> </div>
<div style="float:left;width:50px;height:50px;background-color:#0000ff"> </div>
<div style="clear:both;;width:50px;height:50px;background-color:#ff00ff"> </div>
上のサンプルは、赤と青とピンクのボックスがあり、赤と青にはfloat:leftを指定することで、横並びにしています。ピンクのボックスはclear:bothを指定して回り込みを解除しているので、横に並ばずに下に表示されています。
関連リンク
よく読まれている記事
- 右クリックメニューの表示が遅い【Information】
- 画像の一部にリンクを貼る(クリッカブルマップ【Dreamweaver】
- 一定時間でローテーションする広告【JavaScript】
- Dreamweaver【Dreamweaver】
- クリックした画像を拡大・縮小する【JavaScript】
UpDate:2010-7-24