スタイルシートリファレンス > float

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


float 左または右に寄せて配置する (IE4/N4)

左または右に寄せて配置します。

後に続く内容は、その反対側に回り込みます。

none
指定しない:規定値
left
左に配置
right
右に配置

▲ページ先頭へ

使用例 float

HTMLソース

<html>
<head>
<title>CSS テスト</title>
<style type="text/css">
<!--
.smp1 {
float:right;
}
-->
</style>
</head>
<body>
指定前<br>
<img src="sample.gif">
<p>ブロック要素の<p>タグは画像とは別ラインに表示されます。</p>
指定後<br>
<img src="sample.gif" class="smp1">
<p>floatを指定すると、ブロック要素の<p>タグも画像と同じラインに表示されます。</p>
</body>
</html>

▲ページ先頭へ

ブラウザ上の表示


指定前


画像を右に配置

ブロック要素の<p>タグは画像とは別ラインに表示されます。


指定後


画像を右に配置

floatを指定すると、ブロック要素の<p>タグも画像と同じラインに表示されます。









▲ページ先頭へ

関連項目【配置・表示】

display
ブロック、インラインなど表示形式を指定する
position
配置方法を指定する
top
上からの配置位置を指定する
bottom
下からの配置位置を指定する
left
左からの配置位置を指定する
right
右からの配置位置を指定する
float
左または右に寄せて配置する
clear
回り込みを解除する
z-index
重なりの順序を指定する
direction
文字の表示方向を指定する
unicode-bidi
ユニコードの文字表示の方向を指定する
overflow
はみ出た内容の表示方法を指定する
overflow-x
はみ出た内容横方向の表示方法を指定する (IE5)
overflow-y
はみ出た内容縦方向の表示方法を指定する (IE5)
clip
表示する範囲を指定する
visibility
表示するしないを指定する

▲ページ先頭へ

スタイルシートリファレンス > float