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
