Section 7 でふれたように,ALIGN 属性は使われる要素とその使われ方によって意味が微妙に違う。共通するのは「配置を指定する」という点である。ALIGN 属性の主な3つの意味は,
である。
その要素の範囲を左寄せ・センタリング・右寄せとする。ALIGN="..." の ... の部分に left,center,right を入れて用いる。対象となる要素は,
<P>〜</P> | 段落の行配置を指定する。このとき,</P> は必須。Internet Explorer 2.0 では ALIGN="right" は指定不可。 |
<DIV>〜</DIV> | 行揃え。Internet Explorer 2.0 では無効。Let's begin HTML の Section 6 を復習しよう。 |
<Hn>〜</Hn> | 見出しの行配置を指定する。Internet Explorer 2.0 では ALIGN="right" は指定不可。 |
<HR> | 水平線を画面の左・中央・右に表示させる。Section 12で詳しく解説する。 |
<TR>〜</TR> | 表の行に対して,その中のセルの行配置を指定する。<TD> で ALIGN を設定したならば,そちらが優先される。その行の <TH> には無効。 |
<TD>〜</TD> | 表のセルに対して,その行配置を指定する。 |
<TH>〜</TH> | 表の見出しのセルに対して,その行配置を指定する。 |
これらは,<DIV ALIGN="..."> と同様なのでわかりやすいだろう。
「回り込み」は書籍でよく見られるような,図版などがページのある部分にあって,文字がよけるように配置されるレイアウトのしかたである。
これも,left,right が指定できる。対象となる要素は,<IMG> と <TABLE>〜</TABLE> である。これに ALIGN を指定することにより,画像もしくは表組は左・右に配置され,そのあとの文書はそれらをよけるようにレイアウトされる。
回り込みを途中でやめるときは,
<BR CLEAR="..."> |
を指定する。... に入るのは,回り込みをやめたい配置である。たとえば,left,right へ回り込みを指定したときに,right の回り込みだけを解除することができる。すべての回り込みを解除する場合は all を指定する。
右の回り込みを見ていただこう。
<P>回り込み指定前です。<BR> <IMG SRC="g_sphere.gif" ALT="Floating Image" ALIGN="right"> 画像が右側に配置され,文章は画像をよけてレイアウトされます。 途中で回り込みをやめたくなったら,<BR CLEAR="..."> を使って,<BR CLEAR="right"> のようにすることができます。</P> |
ブラウザの横幅を変えてどうなるかも確認しよう。
回り込み指定前です。 |
これが,画像を単に右側へ配置するのと異なることは,次の例と比べればわかる。
<P>画像を単に右に配置するのは,<BR> <DIV ALIGN="right"><IMG SRC="g_sphere.gif" ALT="Right-flushed Image"></DIV> とします。このとき,文字は画像の下から始まり,回り込みはおこりません。 このような配置は,<CENTER> と用いるのがふつうでしょう。</P> |
画像の直後の文章の開始位置に注意しよう。
画像を単に右に配置するのは, |
<IMG> では left,right で回り込みを指定するほかに,top,middle,bottom で文章中に画像を入れ,その画像と文字との位置関係が指定する。top は文字の上端が画像の上端に一致し,bottom ではその逆である。middle では真ん中あたりに配置される。
位置関係は,← top,← middle,← bottom となります。 |