float(フロート)について

BOXを左、右に寄せ、下に続く要素を回り込ませる設定をするプロパティです。

float(フロート)の概念図

floatのブラウザ表示例

■CSS記述
.sample1 { float:right; }
■XHTML記述
<p class="sample1"><img src="../images/float-test.gif" width="100" height="100" alt="テスト" /></p>

<p>サンプルサンプル…省略</p>

テスト

サンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプル

float(フロート)の設定方法

float: (値);

float(フロート)の値

left , right , none