clear | スタイルシートリファレンス

適用できる要素ブロックレベル要素
継承なし
初期値none

clearとは?

CSSのclearプロパティはfloatプロパティで右寄せや左寄せした要素に対する回り込みを解除するプロパティです。

あわせて読みたい
float
CSSのfloatプロパティは指定した要素をブロック内の左右のどちらに寄せるかを制御するプロパティです。floatプロパティの構文や使い方をサンプルコード付きで解説します。

clearで指定できる値

clearプロパティには下記のキーワード値のいずれかを設定します。

  • none: (初期値)回り込みを解除しない
  • left: 左寄せした要素への回り込みを解除
  • right: 右寄せした要素への回り込みを解除
  • both: 左寄せ・右寄せした要素への回り込みを解除

構文

clear: none | left | right | both;

clearを使ったサンプルコード

上記のサンプルコードでclearプロパティを設定している要素で、floatプロパティの回り込みが解除されて、上下に要素が並んでいることが確認出来ます。

clearのブラウザ対応状況

CSSのclearプロパティはモダンなブラウザのほぼ全てで対応しているプロパティです。clearプロパティの各ブラウザ毎の対応状況を確認したい方は下記よりご確認頂けます。

Can I use... Support tables for HTML5, CSS3, etc

clearプロパティの関連情報

あわせて読みたい
clearfixとは?使い方をサンプルコード付き解説!のイメージ
clearfixとは?使い方をサンプルコード付き解説!
CSSでfloatプロパティと共に使われるclearfixとは何か?その使い方をサンプルコード付きで解説します。