超初心者のためのホームページ作成講座
HTML CSS Dictionary Netscape Color AccessUp Links SiteMap

■ テキストの回り込み

<table> タグの align 属性を使えば、表の横にテキストを配置することができます。

<table border>
  <tr><td>13.</td><td>SEASONS</td></tr>
  <tr><td>14.</td><td>SUREAL</td></tr>
  <tr><td>15.</td><td>M</td></tr>
</table>
これは、align属性を指定しない場合です。align属性のデフォルトはleftですが、何も指定しなければ、表の横にテキストを配置することができません。このテキストも表の下に記述されていますね。

13.SEASONS
14.SURREAL
15.M
これは、align属性を指定しない場合です。align属性のデフォルトはleftですが、何も指定しなければ、表の横にテキストを配置することができません。このテキストも表の下に記述されていますね。

<table border align="left">
  <tr><td>13.</td><td>SEASONS</td></tr>
  <tr><td>14.</td><td>SURREAL</td></tr>
  <tr><td>15.</td><td>M</td></tr>
</table>
上のソースにalign="left"を加えてみました。このテキストが表の右に配置されています。

13.SEASONS
14.SURREAL
15.M
上のソースにalign="left"を加えてみました。このテキストが表の右に配置されています。




<table border align="right">
  <tr><td>13.</td><td>SEASONS</td></tr>
  <tr><td>14.</td><td>SURREAL</td></tr>
  <tr><td>15.</td><td>M</td></tr>
</table>
今度は、align="right"です。このテキストが表の左に配置されています。

13.SEASONS
14.SURREAL
15.M
今度は、align="right"です。このテキストが表の左に配置されています。




<table border align="left">
  <tr><td>13.</td><td>SEASONS</td></tr>
  <tr><td>14.</td><td>SURREAL</td></tr>
  <tr><td>15.</td><td>M</td></tr>
</table>
このように、表の左または右にテキストを配置することを「テキストの回り込み」といいます。テキストの回り込みは表の配置だけではなく、画像の配置でも使えますので、覚えておきましょう。写真を貼り付けて、説明文を加えるときなどに便利ですね。なお、テキストが長くて、表の高さを超える場合は、表の下までテキストが記述されます。

13.SEASONS
14.SURREAL
15.M
このように、表の左または右にテキストを配置することを「テキストの回り込み」といいます。テキストの回り込みは表の配置だけではなく、画像の配置でも使えますので、覚えておきましょう。写真を貼り付けて、説明文を加えるときなどに便利ですね。なお、テキストが長くて、表の高さを超える場合は、表の下までテキストが記述されます。


◆回り込みの解除

テキストの回り込みを途中で解除するには <br> タグの clear 属性を使います。

タグ名プロパティ説明
<br>clearall表の位置に関係なくテキストの回り込みを解除
left表が左側にあるときテキストの回り込みを解除
right表が右側にあるときテキストの回り込みを解除

<table border align="left">
  <tr><td>13.</td><td>SEASONS</td></tr>
  <tr><td>14.</td><td>SURREAL</td></tr>
  <tr><td>15.</td><td>M</td></tr>
</table>
<br>タグのclear属性を使えば、回り込みを解除してテキストがテーブルの下に続きます。
<br clear="left">
<br>タグだけでclear属性を使わなければ、改行はされても、回り込みの解除にはなりません。

13.SEASONS
14.SURREAL
15.M
<br>タグのclear属性を使えば、回り込みを解除してテキストがテーブルの下に続きます。
<br>タグだけでclear属性を使わなければ、改行はされても、回り込みの解除にはなりません。

上の例では、align="left" (表が左側)に合わせて、clear="left" にしました。align="left" にもかかわらず、clear="right" にすると、回り込みは解除されませんので注意して下さい。
clear="all" にしておけば、表の位置が左右どちらでも回り込みを解除することができますので、これを覚えておけばいいでしょう。


 Home < 超初心者のためのホームページ作成講座 < テーブル講座 < Back < テキストの回り込み > Next