- ベストアンサー
背景と別の画像を右下に固定して表示するには？
(1)背景を表示して、さらに(2)右下の位置に固定して別の画像を表示することは出来るのでしょうか？ (1)だけなら、BODYタグの中で設定すれば出来ました。 (2)だけなら、某サイトでコピペしたものを使わせてもらい、表示することが出来ました。 しかし、二つを同時にしようとすると、２番目のものしか表示されません。 どうすべきなのか、無理なのか、ご存知の方、教えてください。 ちなみに、(2)のコピペとは以下のものです。スタイルシートというのでしょうか？良くわかりませんが。 <STYLE TYPE="text/css"> <!-- BODY{ background-image:url(gazou.png); background-attachment :fixed; background-repeat: no-repeat; background-position: 100% 100%; } --> </STYLE>
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
ページ中をテーブルで囲って表示してはいかがでしょうか。 bodyに背景を一つ。 固定する背景は、tableのtdに対して行う。 つまり、 <html> <head> <STYLE TYPE="text/css"> <!-- body { background:url(hoge.gif); } .MainTable td{ background-image:url(gazou.png); background-attachment :fixed; background-repeat: no-repeat; background-position: 100% 100%; } --> </STYLE> </head> <body> <table width="100%" cellspacing="0" cellpadding="0" border="0" class="MainTable"> <tr><td> ～～～～ </td></tr> </table> </body> </html>
その他の回答 (1)
- siyuno_o
- ベストアンサー率26% (135/510)
背景では無いのですが、IE5以降のみでしか動作しませんが、スタイルシートのフィルターを、使えばよく似た事が出来ます 不透明度は、0(透明)～100 <DIV style="FILTER: alpha(opacity=不透明度); POSITION:absolute;top:100%;left:100%;"> <img src="イメージのURL"border=0> </DIV>
お礼
回答どうもありがとうございます。 様々な方法があるのですね。この場合はスクロールバーを動かしたときに絵が動かないのとtopxx%;leftxx%;の数字を画像の大きさや見てる人のブラウザの表示サイズによって変えないといけないみたいですね。 参考にさせていただきました。
![その他([技術者向] コンピューター) イメージ](https://gazo.okwave.jp/okwave/spn/images/related_qa/c205_1_thumbnail_img_sm.png)
![その他([技術者向] コンピューター) イメージ](https://gazo.okwave.jp/okwave/spn/images/related_qa/c205_2_thumbnail_img_sm.png)
お礼
思っていた通りに表示させることが出来ました。 ページ内のほかの部分に<table>を使っていたのでそちらにも画像が表示されてしまったのですが、そのタグより下に<table ... "MainTable">を貼り付けたらうまく表示されました。 どうもありがとうございました。