ウィンドウサイズにあわせた背景画像の大きさの変更

このQ&Aのポイント
  • HTMLでウィンドウサイズにあわせて背景画像のサイズを変更することは可能ですか?
  • 質問者はスタイルシートで背景を固定したページを作成しており、この固定背景をウィンドウサイズにあわせてサイズ変更したいと考えています。
  • 具体的には、800×600の画像を全画面で1024×768とした場合、背景に表示される画像は800×600の時の画像を拡大したものにしたいという要望です。
回答を見る
  • ベストアンサー

ウィンドウサイズにあわせた背景画像の大きさの変更

今スタイルシートで背景を固定したページを作っています。 この固定背景をウィンドウサイズにあわせてサイズ変更したいのですが、HTMLで可能でしょうか? 例えば、800×600を全画面で1024×768とした時、背景に表示される画像は800×600の時のを拡大したもの、というのが理想なんですが・・・。 過去の質問も検索したのですが、検索の仕方が悪いのか、どうもいい感じにならないので・・・。 因みに、現在下記で書いてます。 -------------- <style type="text/css"> <!-- body{background:fixed url(画像) #ffffff no-repeat top left} --> </style> ----------- よろしくお願いします!

noname#185537
noname#185537
  • HTML
  • 回答数1
  • ありがとう数1

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

  • ベストアンサー
  • howsike
  • ベストアンサー率58% (18/31)
回答No.1

一応それらしいことは出来るみたいです。 ただ、スタイルシートでレイヤを作ってるので‥‥ と、書くよりも下記URLが参考になるのでそちらを見てはどうでしょうか^^;

参考URL:
http://tohoho.wakusei.ne.jp/wwwxx037.htm
noname#185537
質問者

お礼

お礼が遅くなってしまってすみません(^ ^; これに文字を載せたかったのでスタイルシートを使ってたんですが、 実際やってみるとかなり好みな感じに出来ました。 アドバイスありがとうございました!!

関連するQ&A

  • Webタグの背景について

    今HPを作っていますが チェックで作った背景に一つの画像を右下に固定表示させたいのですができるでしょうか? 背景固定はできるんですけど画像を右下にやるのができません。 <body background="imagfolder/02.jpg" bgproperties="fixed"> のタグはチェックの背景になっています。 固定で検索すると <STYLE type="text/css"> <!-- BODY { background-image : url("壁紙のURL"); background-attachment: fixed; background-position: 100% 100%; background-repeat: no-repeat; } --> </STYLE> とでてくるんですが・・・

  • Webの背景について

    今HTML、CSSなど使ってHPを作っていますが チェックで作った背景に一つの画像を右下に固定表示させたいのですができるでしょうか? 背景固定はできるんですけど画像を右下にやるのができません。 <body background="imagfolder/02.jpg" bgproperties="fixed"> のタグはチェックの背景になっています。 固定で検索すると <STYLE type="text/css"> <!-- BODY { background-image : url("壁紙のURL"); background-attachment: fixed; background-position: 100% 100%; background-repeat: no-repeat; } --> </STYLE> とでてくるんですがどうしてもチェックの上に加工した画像を右下に固定したいので教えてください。 メモ帳より作成しています。 今月中に仕上げたいのでよろしくお願いします

  • 2つ画像を背景にするスタイルシートってある?

    1つの画像をスタイルシートで背景にするのは、知ってるんですが、2つの画像を同じページに背景にはできるのでしょうか?下記は1つの画像を背景にするスタイルシートです。これのどこかをいじれば可能なのでしょうか? <STYLE TYPE="text/css"> <!--    BODY {       background-image:素材のURL;       background-position:0% 100%;       background-repeat:no-repeat;       background-attachment:fixed;     } --> </STYLE>

    • 締切済み
    • CSS
  • 背景を固定した時の表の背景

    こんにちは。HPを制作し始めたばかりの初心者です。 質問です。 背景をこんな感じて固定した時 <STYLE type="text/css"> <!-- BODY{ background-image : url(○○.jpg); background-repeat : no-repeat; background-attachment : fixed; background-position : 90% 50%; } --> 作ってる表の背景画像が無効になっちゃいます。 なんか間違ってるんでしょうか??? お答えを頂けると有り難いのですが。

    • ベストアンサー
    • HTML
  • 画像のソースを教えてください。

    はじめまして。 ホームページ編集のときに使う画像のソースがわからなくて困っています。 画像を左に固定するのは <style type="text/css"> <!--body{background-attachment:fixed; background-image:url(※); background-repeat:repeat-y; background-position:left;}--> </style> でわかっているのですが、左右に固定するソースがわかりません。 恐らく最後のleftの部分を何かに変えるといいのかな?とは思うのですが。 教えていただけるとありがたいです・

    • ベストアンサー
    • HTML
  • テーブルにスタイルシートを使う方法

    こんにちは、テーブルタグのことで質問があります。 普通、背景画像でスタイルシートを使い右下などに固定するタグは <STYLE TYPE="text/css"> <!-- BODY { background-image : url("画像の名前"); background-repeat : no-repeat; background-attachment : fixed; background-position : left bottom; background-color:#FFFFFF; } --> </STYLE> となると思いますが、これは通常<head></head>の間にいれますよね。 これをテーブルの中で使うにはどうすればいいでしょう? テーブルの背景画像を右下や左下などに固定したいということなんですがそういうことはできますか? よろしくお願いします;

  • 背景の2重指定 タグ

    はじめまして。 背景のタグについて悩んでいまして、 一つは左上に、右下が隙間があるので、もう一つは右下に固定したいのですが、そのような事はできるでしょうか? 今は左上だけできるのですが、右下に固定のやり方がどうしてもわかりません;; このような感じです↓ <style type="text/css"> <!-- body { background-color: #ffffff; background-image: url(http://db1.voiceblog.jp/data/bokunikudasai/1222662705.jpg); background-repeat: no-repeat; background-attachment: fixed; } --> </style> <STYLE type="text/css"> ここからできるでしょうか? わかりにくい質問で申し訳ないのですが、教えてくださったら嬉しいです。

  • 親フレームのリンクからアイフレーム内の背景画像を位置指定して変更する

    アイフレーム内の最初に表示してあるページ内に <style type="text/css"> <!-- body{ background-attachment : fixed; background-repeat : no-repeat } --> </style> を書いて、親フレームのリンクにオンマウスオーバーとjavascriptをつかって、 背景画像を左上固定で繰り返さない指定はできたのですが、 指定する背景画像の位置をその都度変えたい場合に、 親フレーム内のリンクから指定する方法をご存知の方はどうか教えていただけないでしょうか?検索など、いろいろやってみたのですがどうもみつからないんです…

  • 両端に背景画像を入れる

    画面の左右両端に、縦に繰り返しで、画像を背景として入れたいのですがどうすればよいのでしょうか? <STYLE type="text/css"> <!-- BODY { background-image : url("~~.gif"); background-position: left; background-repeat: repeat-y;} --> </STYLE> スタイルシートを使って、とりあえず左にだけ入れることは出来ました。 このあとを教えてください。お願いします。

    • ベストアンサー
    • HTML
  • 掲示板の背景に画像を固定したのですが・・・

    初めまして 検索したのですが、これといった回答が見つからず新記事立てさせて頂きました 掲示板を作成し、スタイルシートを記述する欄があったので 背景画像(○○.gif)を右下に固定しよう・・・と思ったのですが 画像が背景だけではなく、スレッドの背景にも適用されてしまったみたいです これの直し方(正しいスタイルシートの表記)について、ご助力お願いします 見よう見まねの記述なのでとりあえず全て載せてみます(スタイルシート欄に記述した全文) <STYLE type="text/css"><!-- body { scrollbar-face-color:#ffffff; scrollbar-track-color:#ffffff; scrollbar-arrow-color:#7323c4; scrollbar-3dlight-color:#7323c4; scrollbar-highlight-color:#ffffff; scrollbar-shadow-color:#7323c4; scrollbar-darkshadow-color:#ffffff; } BODY,TD,TH{ line-height:16pt; background-image : url(○○.gif); background-repeat : no-repeat; background-attachment : fixed; background-position : right bottom; } a{ text-decoration:none; cursor:s-resize; } --> </STYLE> どうぞよろしくお願いいたします

    • ベストアンサー
    • HTML

専門家に質問してみよう