表のセル内の余白（マージン）を指定する

2020年3月31日
2020年4月12日
HTMLタグ一覧, テーブルタグ

テーブルタグ

1 <table cellpadding=””>
2 記述例
- 2.1 関連情報

<table cellpadding=””>

テーブルタグに「cellpadding=””」という属性を追加すると、表の各セル内の余白を調整することができます。表のセル内の余白とは以下の図の部分です。表の罫線と同様に、この属性を省略している場合でも、余白が挿入されており、さらに表や表内のセルに背景色は背景画像が指定されていない場合は、この余白は透明で挿入されています。

このセル内の余白を調節するためはピクセルによる絶対値で指定します。

記述例

・セル内の余白を3ピクセルで表示
<table border=”1″ cellpadding=”3″>
<tr>
<td>この領域をセルと呼ぶ</td>
</tr>
</table>
<br>
・セル内の余白を0にする
<table border=”1″ cellpadding=”0″>
<tr>
<td>この領域をセルと呼ぶ</td>
</tr>
</table>

・セル内の余白を3ピクセルで表示

この領域をセルと呼ぶ

・セル内の余白を0にする

この領域をセルと呼ぶ

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

表のセル内の余白はこの「cellpadding」の属性により一括でのみ指定できます。従って各セル毎には指定できません。余白は本来スタイルシートで指定することが推奨されています。

余白（パディング）を上下左右個別に指定する – スタイルシート（CSS）一覧