A.T-MOON

contents

パンくずリスト

メッセージエリア



    テーブルのサイズ

メッセージエリア


マーク テーブルのサイズ指定 <table width="A" height="B">〜</table>

<table>タグwidth属性height属性を使ってテーブルのサイズを指定します。
Aピクセルまたはパーセントで指定し、Bピクセルで指定します。

※例)
セル1 セル2 セル3
セル4 セル5 セル6
上の囲まれている部分が
border="1" width="180" height="200"のテーブルです
<html>
 <head>
  <title>ココにタイトル</title>
 </head>
 <body>
 <font color=red>※例</font><br>
 <table border="1" width="180" height="200">
  <tr>
   <td>セル1</td>
   <td>セル2</td>
   <td>セル3</td>
  </tr>
  <tr>
   <td>セル4</td>
   <td>セル5</td>
   <td>セル6</td>
  </tr>
 </table>
 上の囲まれている部分が<br>
 border="1" width="10" height="200"のテーブルです
 </body>
</html>
パーセントで指定する場合は表示するブラウザの大きさにより変化しますので注意しましょう。
又、<table>タグでのheight属性は、HTML4.01では定義されていませんので
高さを指定する場合は<td>タグ<th>タグの属性として定義されているheight属性を利用して
セルのサイズを指定した方がよいようです。
そして大切なことですがwidth属性height属性でサイズを指定する場合
テーブルのbodercellspacingcellpaddingを含めてのサイズとなるので
これらの値を考慮した上でサイズを指定してください。
又スタイルシートでの指定もありますので参照してみて下さい。

ページTOP



マーク セルのサイズ指定 <table><tr><td width="A" height="B">〜</td></tr></table>

<td>タグwidth属性height属性を使ってセルのサイズを指定します。
ABはそれぞれピクセルで指定します。

※例)
セル1 セル2 セル3
セル4 セル5 セル6
上の囲まれている部分がテーブルで
セル1に width="100" height="80"
セル4に height="150"を指定しています
<html>
 <head>
  <title>ココにタイトル</title>
 </head>
 <body>
 <font color=red>※例</font><br>
 <table border="1">
  <tr>
   <td width="100" height="80">セル1</td>
   <td>セル2</td>
   <td>セル3</td>
  </tr>
  <tr>
   <td height="150">セル4</td>
   <td>セル5</td>
   <td>セル6</td>
  </tr>
 </table>
 上の囲まれている部分がテーブルで<br>
 セル1に width="100" height="80"<br>
 セル4に height="150"を指定しています
 </body>
</html>
見ていただくとわかるように、ひとつのセルに対してサイズを指定すると
隣接しているセルの辺のサイズもそれと同じサイズになります。
又、それぞれのセルを指定したとしても、一番大きいサイズにあわされてしまいますので注意して下さい。

セルのサイズを指定しない場合(デフォルト)はテキストに合わせてサイズが変わりますが
この場合でも一番大きい物にあわされてしまいます。

ページTOP

テーブルの基本 テーブルの枠の指定