表示例；
画像の貼り付けの例として、ダビンチのモナリザを文章中に置いてみる。
これは align="left" を指定した画像です。画像が左側に寄せられ、後続する要素は右側に流れ込みます。新しい要素や改行があっても、新しい行は画像の横から新たに始まります。
last modified 10th/Oct. 2000
オブジェクト、画像、表、フレームなどの align 属性は、それらを左または右端に浮動させます。可能な値は次の2つ；
left: オブジェクトを現在の左マージンに浮動させる。以降の要素はオブジェクトの右側に流れる。right: オブジェクトを現在の右マージンに浮動させる。以降の要素はオブジェクトの左側に流れる。 例えば、表を表す TABLE 要素に対しては、 center も指定できますが、この時浮動化は起こらず、左右のマージンの間の空間が計算されて、その中央に表示されます。
align 属性は、段落を表す P 要素と、ブロック要素のグループ化要素である DIV 要素に対しても定義されていますが、この場合は要素の浮動化は起こらず、当該要素の内容が中央に揃えられます。
<img align="left" src="http://foo.com/animage.gif" alt="わたしのボート">
この画像は左端に浮動化され、後続するテキストは右脇に流れ込みます。
表示例；
画像の貼り付けの例として、ダビンチのモナリザを文章中に置いてみる。
これは align="left" を指定した画像です。画像が左側に寄せられ、後続する要素は右側に流れ込みます。新しい要素や改行があっても、新しい行は画像の横から新たに始まります。
align 属性自身が廃止予定の非推奨属性ですから、出来るだけスタイルシートで実現しましょう。
浮動化されたオブジェクトの脇にテキストが流れ込むのを禁止したい場合は、 BR 要素に定義された clear 属性を用います；
<p> <img src="../back.jpg" float="left"> 左端にフロートした要素に対して後続するテキストは、 フロート要素の右脇に流れ込みます。<br clear="left"> clear 属性をもつ BR 要素を利用すると、流れ込みが禁止できます。 </p>
clear 属性 は align 属性と同じく廃止予定の非推奨属性です。
none: 次の行は、普通に始まる。これが初期値です。 left: 次の行は、左側の全浮動オブジェクトの最下端の直下からはじまる。right: 次の行は、右側の全浮動オブジェクトの最下端の直下からはじまる。all: 次の行は、左右両側にある全浮動オブジェクトの最下端の直下からはじまる。BR 要素は %Special に属するインライン要素です。
利用例；
浮動化の例として、ダビンチのモナリザを文章中に挿入してみる。
これは align="left" を指定した画像です。画像が左側に寄せられ、後続する要素は右側に流れ込みます。新しい要素や改行があっても、新しい行は画像の横から新たに始まります。
| ここは表要素です。 |
| align="right" が与えられています。 |
| 右端に浮動化される筈です。 |
| 後続する要素は左脇に流れ込みます。 |
<br clear="left"> を記述します。
これで、浮動化した要素に後続する要素は、要素の下端、次の行から新たに始まります。
ここでは、「モナリザ」に与えたalign="left"のために、画像が浮動化して左端に寄せられ、後続するテキストが、右側に流れたので、流れ込みを終了させる目的で<br clear="left">を書きました。
TABLE 要素のalign="right"に対しては、<BR clear="right">によって周りこみが解消します。
BR 要素の clear 属性と、IMG 要素や TABLE 要素などの align 属性は旧版の HTML との下位互換のために用意されたものの、廃止予定の非推奨属性です。できるだけスタイルシートで実現するように御奨めします。
次に、 CSS の 'float' プロパティによる要素の不動化と、 'clear' プロパティによる周り込みの中止に付いて紹介します。