1. Home
  2. HTMLタグ
  3. テーブルタグ
  4. 表の背景に画像を表示する

表の背景に画像を表示する


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

ブラウザ
IE
Fx
Sf
Cr
O
分類
独自拡張属性
要素
table要素
tr要素
td要素
th要素

table要素tr要素td要素th要素background="" を追加すると、表の背景に画像を表示できます。



<table background="back.gif"></table>


■表全体の背景画像を指定する場合

<table background="back.gif"></table>

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

■行単位で背景画像を指定する場合

<tr background="back.gif"></tr>

tr要素background="" を追加します。(IEでは対応していません)

■セル単位で背景画像を指定する場合

<td background="back.gif"></td>

td要素(th要素)background="" を追加します。


属性 説明
background="" URI 表示する画像ファイルを指定

上記の属性は、HTML 4.01では定義されていません。

メモ

この指定内容はスタイルシートで代替することができます。指定方法の詳細は「関連ページ」をご覧ください。


使用例

[サンプル画像] この画像を背景に指定しています。


■表全体の背景画像を指定した例


<table border="3" background="back.gif">
<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

■行単位で背景画像を指定した例

※IEでは対応していません


<table border="3">
<tr>
<td>データセル1-1</td>
<td>データセル1-2</td>
<td>データセル1-3</td>
</tr>
<tr background="back.gif">
<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 background="back.gif">データセル1-2</td>
<td>データセル1-3</td>
</tr>
<tr>
<td>データセル2-1</td>
<td background="back.gif">データセル2-2</td>
<td>データセル2-3</td>
</tr>
<tr>
<td>データセル3-1</td>
<td background="back.gif">データセル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

テーブルタグ

ページの先頭へ


inserted by FC2 system