January 7, 2006
テーマ： ホームページ作成の悩み(545)
カテゴリ： ホームページ作成教室
今日のテーマは「 背景に画像を持ってくる方法
」です
基本なので、よく理解しておきましょうね
今までの「HTML教えます」講義で表の背景に色をつけるのは、やってきました
まだ見てない人はこの辺りから見てください>>「 HTML教えます その９ 」
復習として、簡単な表の色づけ
この 黄色 の表背景を別の画像を貼り付けて、それを背景とします
例えばこんな画像を↓
さっきの例の表背景に貼り付けたいときは…
すこし表が小さすぎて、きちんと背景が変わっているか見にくいのでサイズアップ！
まわりの表の線が邪魔って方のために
どうですか？
どうやったか分かりましたでしょうか？
画像を背景に持ってくるときは <background="○○"> タグを用いるのです
ここで注意しなくてはいけない点が一つ！
今まで、私が画像関係のタグを紹介しているときは "カメの画像" のように適当にやっていましたが、今回はきちんと "http://image.space.rakuten.co.jp/lg01/16/0000178716/40/imgaa18bb2c8t9mdc.gif" と入力して説明しました
今まで説明してきませんでしたが、「 相対パス 」と「 絶対パス 」というのが関係してきます
まぁでも正直これを知らなくても何も問題ないので省略ｂ
ようは、この楽天ブログで画像を背景に使いたいときは「 画像オプション 」で使いたい画像を登録します
つぎに、フォト管理（画像オプション）でその画像の「 HTMLタグ 」を調べます！こんなやつ↓
この「 HTMLタグ 」の中で<img src="○○">にあたる
"http://image.space.rakuten.co.jp/lg01/16/0000178716/40/imgaa18bb2c8t9mdc.gif" という部分を使います
この部分がつまりは上の例で表しているように <background="○○"> の○○に入る部分なのです！
とりあえず、今回は以上です！
基本なので、よく理解しておきましょうね
今までの「HTML教えます」講義で表の背景に色をつけるのは、やってきました
まだ見てない人はこの辺りから見てください>>「 HTML教えます その９ 」
復習として、簡単な表の色づけ
HTML
<table border="1" bgcolor="yellow"
>
<tr><td>A</td><td>B</td></tr>
<tr><td >C</td><td >D</td></tr>
</table>
<tr><td>A</td><td>B</td></tr>
<tr><td >C</td><td >D</td></tr>
</table>
表示
| A | B |
|---|---|
| C | D |
この 黄色 の表背景を別の画像を貼り付けて、それを背景とします
例えばこんな画像を↓
さっきの例の表背景に貼り付けたいときは…
HTML
<table border="1" background="http://image.space.rakuten.co.jp/lg01/16/0000178716/40/
imgaa18bb2c8t9mdc.gif" >
<tr><td>A</td><td>B</td></tr>
<tr><td >C</td><td >D</td></tr>
</table>
imgaa18bb2c8t9mdc.gif" >
<tr><td>A</td><td>B</td></tr>
<tr><td >C</td><td >D</td></tr>
</table>
表示
| A | B |
|---|---|
| C | D |
すこし表が小さすぎて、きちんと背景が変わっているか見にくいのでサイズアップ！
HTML
<table border="1" background="http://image.space.rakuten.co.jp/lg01/16/0000178716/40/
imgaa18bb2c8t9mdc.gif" width="100" height="75" >
<tr><td>A</td><td>B</td></tr>
<tr><td >C</td><td >D</td></tr>
</table>
imgaa18bb2c8t9mdc.gif" width="100" height="75" >
<tr><td>A</td><td>B</td></tr>
<tr><td >C</td><td >D</td></tr>
</table>
表示
| A | B |
|---|---|
| C | D |
まわりの表の線が邪魔って方のために
HTML
<table border=" 0
" background="http://image.space.rakuten.co.jp/lg01/16/0000178716/40/
imgaa18bb2c8t9mdc.gif" width="100" height="75" >
<tr><td>A</td><td>B</td></tr>
<tr><td >C</td><td >D</td></tr>
</table>
imgaa18bb2c8t9mdc.gif" width="100" height="75" >
<tr><td>A</td><td>B</td></tr>
<tr><td >C</td><td >D</td></tr>
</table>
表示
| A | B |
|---|---|
| C | D |
どうですか？
どうやったか分かりましたでしょうか？
画像を背景に持ってくるときは <background="○○"> タグを用いるのです
ここで注意しなくてはいけない点が一つ！
今まで、私が画像関係のタグを紹介しているときは "カメの画像" のように適当にやっていましたが、今回はきちんと "http://image.space.rakuten.co.jp/lg01/16/0000178716/40/imgaa18bb2c8t9mdc.gif" と入力して説明しました
今まで説明してきませんでしたが、「 相対パス 」と「 絶対パス 」というのが関係してきます
まぁでも正直これを知らなくても何も問題ないので省略ｂ
ようは、この楽天ブログで画像を背景に使いたいときは「 画像オプション 」で使いたい画像を登録します
つぎに、フォト管理（画像オプション）でその画像の「 HTMLタグ 」を調べます！こんなやつ↓
この「 HTMLタグ 」の中で<img src="○○">にあたる
"http://image.space.rakuten.co.jp/lg01/16/0000178716/40/imgaa18bb2c8t9mdc.gif" という部分を使います
この部分がつまりは上の例で表しているように <background="○○"> の○○に入る部分なのです！
とりあえず、今回は以上です！
お気に入りの記事を「いいね！」で応援しよう
[ホームページ作成教室] カテゴリの最新記事
-
HTML教えます その36 February 12, 2006 コメント(6)
-
HTML教えます その35 February 10, 2006
-
HTML教えます その34 February 7, 2006 コメント(1)
【毎日開催】
15記事にいいね！で1ポイント
PR
Freepage List
HANMANI
あくまでも趣味の範囲で、お家で美味しい珈琲を飲もうと頑張る人を応援するブログサイトです。
Category
© Rakuten Group, Inc.
