テーブルの背景画像を表示する
テーブル(ホームページやブログなどのウェブサイトで表示する表)に、背景画像を指定することができます。HTMLソースのTABLEタグ内にBACKGROUND属性で、背景画像のURLを指定します。テーブル全体に、セルごとに、または行ごとになどさまざまな指定が可能です。
<タグ名 background="背景画像URL">~</タグ名>
- タグ名: table タグを指定すると そのテーブル全体に、tr タグを指定すると その列全体に、th または td タグを指定すると そのセル単体に背景画像を指定することができます。
- 背景画像URL:絶対パスまたは相対パスで指定できます。
サンプルソースです。
■サンプル1:テーブル全体に背景画像を指定する。次のhtml ソースは、table タグで このテーブル全体に背景画像を指定しています。
<table background="./sample/sun.gif" border="1" width="220" height="165">
<tr><td>この</td><td>テーブル</td><td>は</td></tr>
<tr><td>全体に</td><td>背景画像を</td><td>指定</td></tr>
<tr><td>して</td><td>いま</td><td>す。</td></tr>
</table>
<tr><td>この</td><td>テーブル</td><td>は</td></tr>
<tr><td>全体に</td><td>背景画像を</td><td>指定</td></tr>
<tr><td>して</td><td>いま</td><td>す。</td></tr>
</table>
このソースを表示させると次のようになります。
| この | テーブル | は |
| 全体に | 背景画像を | 指定 |
| して | いま | す。 |
■サンプル2:行ごと、セルごとに背景画像を指定する:次のhtml ソースは 1行目のセル全体と、2行目の真ん中のセルと、3行目の1番右のセルだけ背景画像を指定しています。
<table border="1" width="220" height="165">
<tr background="./sample/sun.gif">
<td>この列は</td><td>背景画像を</td><td>指定しています</td>
</tr>
<tr><td>なし</td>
<td background="./sample/sun.gif">このセルは背景画像を指定しています</td>
<td>なし</td></tr>
<tr><td>なし</td><td>なし</td>
<td background="./sample/sun.gif">このセルは背景画像を指定しています</td></tr>
</table>
<tr background="./sample/sun.gif">
<td>この列は</td><td>背景画像を</td><td>指定しています</td>
</tr>
<tr><td>なし</td>
<td background="./sample/sun.gif">このセルは背景画像を指定しています</td>
<td>なし</td></tr>
<tr><td>なし</td><td>なし</td>
<td background="./sample/sun.gif">このセルは背景画像を指定しています</td></tr>
</table>
このソースを表示させると次のようになります。
| この列は | 背景画像を | 指定しています |
| なし | このセルは背景画像を指定しています | なし |
| なし | なし | このセルは背景画像を指定しています |
ランキングに参加中です! お役に立てたらクリックをお願いします→
コンピュータとインターネット > データ形式 > HTML > リファレンス