• ベストアンサー

ホームページの背景画像

ホームページに (1)まず1つ全面に背景画像をつけます。 (2)そして、ページの左上だけに別の画像をつけたいと思っています。 それぞれ別々にならできるのですが、二つの画像を1つのページに重ねるにはどうすればいいのでしょうか?

質問者が選んだベストアンサー

  • ベストアンサー
noname#96725
noname#96725
回答No.3

PCやプログラミングにお詳しいようなのでHTMLの手書きは大丈夫と思いますので…。 一般的に言えば画像の重なりはz-indexでコントロールします。 例; <BODY> <P><IMG src="backgroundimage.jpg" width="1000" height="700" border="0"><BR> <SPAN style="position:relative; top:-400;"><IMG src="surfaceimage.gif" width="100" height="80" border="0" z-index="1"></SPAN></P> </BODY> 例のように上に乗るsurface.gifのpositionを絶対値か相対値で指定しないと画像は重ならずに下方へ繰り下がります。 このsurface.gifの更に上に他の画像をのせるなら新しい画像をz-index="2"のように数字を増やして下さい。どんどん乗せられます。 なお、CSSで書くならz-index:1; というようになります。 最初の画像を背景画像とするなら#1の方のように <BODY background = "画像のURL/background.jpg"> としてやれば特にz-indexを記述しないでもposition指定だけでOKです。(画像位置によってはそれさえも不要)

genkigan
質問者

お礼

回答、ありがとうございました。 お教えいただいたとおり何度かやってみたのですが、重なりません。というか、backgroundimage.jpgのほうが表示されません。もう少し試してみます。まずはお礼まで。

その他の回答 (2)

  • awasumi
  • ベストアンサー率41% (23/56)
回答No.2

一つの要素(この場合body)に指定できる背景画像は、ひとつです。 なのでスタイルシートで以下のように記述します。 html{ background-image:url(***.gif); } body{ background-image:url(***.gif); background-repeat:no-repeat; background-position:left top; } ただし、DOCTYPE宣言が標準準拠モードの場合のみ有効な手段ですのでDOCTYPE宣言を以下のように↓ <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 詳しくは参考URLを参考にしてください。 #<body background="">はHTML4.01では非推奨とされています。スタイルシートで指定することをお勧めします。

参考URL:
http://www.stylish-style.com/csstec/hi-level/double-back.html
genkigan
質問者

お礼

回答、ありがとうございました。やってみたのですが、なぜか上手くいきません。もう少し試してみます。

  • hana-hana3
  • ベストアンサー率31% (4940/15541)
回答No.1

背景画像(<body background="xxx.jpg">)で設定したなら問題ないはずですけど?

genkigan
質問者

お礼

001.jpg を背景に、そして、その上に 002.jpg を重ねたいとき、どのようにタグを書けばいいのでしょうか?

関連するQ&A

専門家に質問してみよう