HTMLタグ/CSS一覧と初心者向けホームページ作成解説集:HTMLタグボード

HTMLタグボードのトップへ戻る ゼロから始めるホームページ作成講座 訪問者優位のWEBデザインTips インターネットで小遣い稼ぎ 今すぐ使える!便利ツール(HTMLタグ辞典など)


テーブルタグ

セルごとに横幅をサイズ指定する

<td width="">

ここでは、行と列で囲まれた一つの領域を「セル」と呼びますが、HTMLの表でもセルごとに横幅を指定できます。<td>タグに「width=""」という属性を追加します。セルの横幅とは、以下の図の『セルの幅』に該当します。

表(テーブル)で変えることのできる部分

「width=""」に入力できる値はピクセルかパーセントです。ピクセルは絶対的な指定方法で、一方パーセントは相対的な指定法です。パーセントによる実際の長さはテーブル全体の横幅に対する長さになります。

ピクセルで指定する場合は、セルの長さが優先されますので、テーブル全体の横幅を指定する必要はありませんが、パーセントで指定する場合は、基準となる長さが必要なため、テーブル全体の長さを必ず指定する必要があります。

また、ピクセルによる指定とパーセントによる指定どちらの場合でも、以下の例のような複数列を持つ表(テーブル)の場合、各セルの横幅の合計は、表全体の横幅に一致していなければなりません。従って、パーセントの場合は特に合計が100%となるよう指定してください。

また、複数の行や列がある表の場合、セルの横幅を指定するのは最上段の行だけでOKです。他の行は上段で指定された横幅に合わされますので、全段のセルにおいて横幅を指定する必要はありません。

タグをコピーする

記述例

・セルをピクセルで指定
<table border="1">
<tr>
<td width="100">左のセル</td><td width="50">右のセル</td>
</tr>
</table>
左のセル 右のセル

・セルをパーセントで指定
<table border="1" width="150">
<tr>
<td width="66%">左のセル</td><td width="34%">右のセル</td>
</tr>
</table>
左のセル 右のセル

※分かりやすくするために枠を表示しています。

☆ワンポイントアドバイス

セルの横幅を指定した場合は、指定方法に関わらず横幅が固定されます。従って、セルに書き入れた文字の大きさによっては、自動的に改行されて表示されます。

参考

タグをコピーするには?

操作方法

→マウスでフォーム内に書かれたタグをクリックするとタグがハイライトするので、マウスの右クリックでコピーするか、キーボードの[Ctrl]+[C]を押すと、コンピュータのメモリに記憶されます。後は任意の場所に貼り付けてください。