<table bgcolor=""></table> <tr bgcolor=""></tr> <td bgcolor=""></td>

ブラウザ
  • IE
  • Cr
  • Sf
  • Fx
  • O
分類
要素

table要素、tr要素、td要素、th要素に bgcolor="" を追加すると、表の背景色を指定できます。


<table bgcolor="#cccccc"> ～ </table>
表全体の背景色を指定する場合
<table bgcolor="#cccccc"> ～ </table>

table要素に bgcolor="" を追加します。

行単位で背景色を指定する場合
<tr bgcolor="#cccccc"> ～ </tr>
tr要素に bgcolor="" を追加します。
セル単位で背景色を指定する場合
<td bgcolor="#cccccc"> ～ </td>

td要素（th要素）に bgcolor="" を追加します。

属性 値 説明
bgcolor="" 色 背景色を指定

上記の属性は、HTML 4.01では非推奨とされています。（Strict DTDでは使用できません）

色の指定は、ハッシュ（ # ）で始まる6桁のカラーコードか、redやgreen、whiteといったカラーネームで行います。詳細についてはカラーチャートのページをご覧ください。

使用例

表全体の背景色を指定した例

<table border="3" bgcolor="#e3f0fb">
<tr>
<td>データ1-1</td>
<td>データ1-2</td>
<td>データ1-3</td>
</tr>
<tr>
<td>データ2-1</td>
<td>データ2-2</td>
<td>データ2-3</td>
</tr>
<tr>
<td>データ3-1</td>
<td>データ3-2</td>
<td>データ3-3</td>
</tr>
</table>
表示例
データ1-1 データ1-2 データ1-3
データ2-1 データ2-2 データ2-3
データ3-1 データ3-2 データ3-3
行単位で背景色を指定した例

<table border="3">
<tr>
<td>データ1-1</td>
<td>データ1-2</td>
<td>データ1-3</td>
</tr>
<tr bgcolor="#ffffc0">
<td>データ2-1</td>
<td>データ2-2</td>
<td>データ2-3</td>
</tr>
<tr>
<td>データ3-1</td>
<td>データ3-2</td>
<td>データ3-3</td>
</tr>
</table>
表示例
データ1-1 データ1-2 データ1-3
データ2-1 データ2-2 データ2-3
データ3-1 データ3-2 データ3-3
セル単位で背景色を指定した例

<table border="3">
<tr>
<td>データ1-1</td>
<td bgcolor="#c0ffc0">データ1-2</td>
<td>データ1-3</td>
</tr>
<tr>
<td>データ2-1</td>
<td bgcolor="#c0ffc0">データ2-2</td>
<td>データ2-3</td>
</tr>
<tr>
<td>データ3-1</td>
<td bgcolor="#c0ffc0">データ3-2</td>
<td>データ3-3</td>
</tr>
</table>
表示例
データ1-1 データ1-2 データ1-3
データ2-1 データ2-2 データ2-3
データ3-1 データ3-2 データ3-3
上記を全て指定した例

<table border="3" bgcolor="#e3f0fb">
<tr>
<td>データ1-1</td>
<td bgcolor="#c0ffc0">データ1-2</td>
<td>データ1-3</td>
</tr>
<tr bgcolor="#ffffc0">
<td>データ2-1</td>
<td bgcolor="#c0ffc0">データ2-2</td>
<td>データ2-3</td>
</tr>
<tr>
<td>データ3-1</td>
<td bgcolor="#c0ffc0">データ3-2</td>
<td>データ3-3</td>
</tr>
</table>
表示例
データ1-1 データ1-2 データ1-3
データ2-1 データ2-2 データ2-3
データ3-1 データ3-2 データ3-3