テーブルに背景画像を固定
テーブル（表）に背景画像を固定
no-repeat （画像をリピートさせない）を使います。例えば、画像をセル内の右下に固定する場合↓↓
<td style="background:url(画像のアドレス) no-repeat right bottom">
サンプルでは表を見やすくするために枠線を表示しています。テーブルに枠線を付けるのには border= と cellspacing= を使います。
border で枠線の高さを cellspacing で枠線の太さを変えることが出来ます。
背景色が枠線の色になります。
| 左上 left top | 中央上 center top | 右上 right top |
| 左中 left center | 中央 center | 右中 right center |
| 左下 left bottom | 中央下 center bottom | 右下 right bottom |
背景画像をテーブルの左上に固定
| 背景画像をテーブルの左上に固定 |
<table width="300" height="200" cellspacing="1"
bgcolor="#999999">
<tr>
<td style="background:url(画像のファイル名) no-repeat left top; background-color:#ffffff">
</td>
</tr>
</table>
上記のソース<tr>
<td style="background:url(画像のファイル名) no-repeat left top; background-color:#ffffff">
</td>
</tr>
</table>
背景画像をテーブルの右上に固定
| 背景画像をテーブルの右上に固定 |
背景画像をテーブルの上真ん中に固定
| 背景画像をテーブルの上真ん中に固定 |
背景画像をテーブルの左下に固定
| 背景画像をテーブルの左下に固定 |
背景画像をテーブルの右下に固定
| 背景画像をテーブルの右下に固定 |
背景画像をテーブルの下真ん中に固定
| 背景画像をテーブルの下真ん中に固定 |
背景画像をテーブルの左真ん中に固定
| 背景画像をテーブルの左真ん中に固定 |
背景画像をテーブルの右真ん中に固定
| 背景画像をテーブルの右真ん中に固定 |
背景画像をテーブルのど真ん中に固定
| 背景画像をテーブルのど真ん中に固定 |
テーブル枠線の種類 かわいい点線 CSSボーダースタイル CSSボーダー CSSテーブル
★skip ページtop
