• ベストアンサー

背景画像の位置固定

makimaki7の回答

  • ベストアンサー
  • makimaki7
  • ベストアンサー率38% (7/18)
回答No.1

スタイルシートを使えば指定できます。 BODYセレクタに以下の属性を加えて調節できます。 背景を繰り返させない為の属性と値 background-repeat: no-repeat 画像の位置の設定の属性と値 background-position: *** +++ ***には横方向の指定(left、center、right、pix、%) +++には縦方向の指定(top、center、bottom、pix、%) 横と縦の指定する値の間には半角スペースを入れます。 画像を固定する為の属性と値 background-attachment:fixed ↓こちらで詳しく説明されていますので、参考にしてみて下さい。

参考URL:
http://tohoho.wakusei.ne.jp/wwwcss2.htm#Background
Planet_Blue
質問者

お礼

どうも有難う御座いました。助かります。  先ほど、もう一度過去ログを見直していたら、 CCSのことについてありました。  同じようなことを質問してすみませんでした。 気にさわられたら申し訳ありません。  それではこれからもヨロシクお願い致します。

関連する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> とでてくるんですがどうしてもチェックの上に加工した画像を右下に固定したいので教えてください。 メモ帳より作成しています。 今月中に仕上げたいのでよろしくお願いします

  • 背景画像を1つだけ中央右側に固定

    他の方が何度も質問なさっているのを見ても解決しないので質問させていただきます。 タイトルそのまま、背景画像を繰り返すことなく、1つだけ中央右側に固定したいのですが、上手くいきません。 素材屋さんや、小技を教えてくださるサイトさんを拝見して、表示されているのをコピーして画像URLだけを変えて貼り付けてみてもうまくいきません。(もちろん「教えて!goo」の過去の質問で回答された方の書かれたものも試しました。) 画像を固定するだけなら、 <BODY background="***.gif" bgproperties="fixed"> で固定されます。1つだけ中央右側に、というのができません。 HP作成に使っているのはフロントページエクスプレスです。(Windous XP ブラウザはIE6.0) 背景画像はgifで表示できないなんてことはないですし、ちゃんとアップロードした画像を使っています。 失敗の原因がわからないので、どうぞよろしくお願いします。

  • 背景を固定してリピートさせたくないとき

    背景を左上に固定したいのですが、 「no-repeat」をどこに入れたらいいのでしょうか? どなたか教えてください。 <body background="URL" bgproperties="fixed"> <p><font size=2 color="0033CC"><b>Since: March 2003<br>Last Up Date: 12.5.2004</b></font></p> ・・・

  • gaiax系ページでの背景の固定

    こんにちわ。 先日、背景を固定して文字だけスクロールしたいという件で質問しましたところ、スタイルシートをつかったり、bodyタグでの方法を教えて頂きました。ところが、私のページはgaiaxであり、デザインの変更の背景URLのところに教えて頂いたスタイルシートなどのタグを張り付けてみたところ、背景はうまく固定できたのですが、今度は画面の左上に文字の色などを示すタグが勝手に表示され、こちらで設定した文字の色なども無効になってしまいました。スタイルシートではこちらを張り、 <STYLE TYPE="text/css"><!-- BODY{ background-image:url("画像の名前"); background-repeat : no-repeat ; background-attachment : fixed; background-position: bottom right;} --> </STYLE> bodyタグではこちらを試してみました。 <BODY background="○○○" bgcolor="○○○" bgproperties="fixed"> ・・・・・ </BODY> いずれにしても変なタグが画面上部に勝手に表示されてしまうんです。 それに文字なども私は白で設定したのですが、勝手に黒になってしまいます。 どうしたらよいのでしょうか? メインのお知らせ欄に張るということも考えてみたのですが、 そうすると、日記画面での背景は別になってしまいますよね? 御回答よろしくお願い致します。

    • ベストアンサー
    • HTML
  • IE以外のブラウザで、背景を固定させる方法

    まったく同じタイトルで、質問されているカタがいらっしゃいましたが、回答を読んでも分からなかったので質問させていただきます。 MS FrontPage 2000でHPを作ったのですが、IEではうまく背景固定がされるのですが、Firefoxでは、背景固定ができず、スクロールすると背景が動きます。 HTMLの部分を見ると、 <body bgcolor="#FFFFFF" text="#000000" background="bear.jpg" bgproperties="fixed" background-attachment:fixed > と言う記述があり、この部分がカギになっているようなのですが、どう変えれば、IEでもFirefoxでも固定されて表示されるのか分かりません。お教えいただけないでしょうか?

  • 背景と別の画像を右下に固定して表示するには?

    (1)背景を表示して、さらに(2)右下の位置に固定して別の画像を表示することは出来るのでしょうか? (1)だけなら、BODYタグの中で設定すれば出来ました。 (2)だけなら、某サイトでコピペしたものを使わせてもらい、表示することが出来ました。 しかし、二つを同時にしようとすると、2番目のものしか表示されません。 どうすべきなのか、無理なのか、ご存知の方、教えてください。 ちなみに、(2)のコピペとは以下のものです。スタイルシートというのでしょうか?良くわかりませんが。 <STYLE TYPE="text/css"> <!-- BODY{ background-image:url(gazou.png); background-attachment :fixed; background-repeat: no-repeat; background-position: 100% 100%; } --> </STYLE>

    • ベストアンサー
    • HTML
  • グラデーション背景と画像固定背景

    こんにちは。 ホームページ作成初心者の者なのですが、ページの背景をグラデーション背景の上に固定した画像背景を乗っけようと考えているのですが、グラデーション背景のタグを入れると画像背景のタグが無効になってしまいます。この二つを同時に有効にする事は不可能なのでしょうか。 ちなみにタグは <HEAD> <STYLE> <!--BODY { background-image : url(back2.gif) ; background-repeat : no-repeat ; background-position : 90% 90% ; background-attachment : fixed ;} --> </STYLE> <STYLE> <!-- body{ filter:progid:DXImageTransform.Microsoft.Gradient (startcolorstr='#68b4ff',endcolorstr='#ffffff',gradienttype='1') } --> </STYLE> (省略) </HEAD>

  • 画像にオンマウスで背景画像を固定

    画像にオンマウスで背景を水平方向+上に固定するにはどうしたら良いのでしょうか? 今現在使用しているタグだと垂直水平方向に繰り返しになってしまいます。 使用しているソースは以下のとおりです。 ---------------------------------- </HEAD> <BODY> <TABLE cellspacing="0"> <TBODY> <TR> <TD onmouseover="body.style.background='url(/image/001.jpg) fixed repeat';" onmouseout="body.style.background='';"><IMG src="/image/001.jpg" width="200" height="200" border="1"></TD> </TR> <TR> <TD onmouseover="body.style.background='url(/image/002.jpg) fixed repeat';" onmouseout="body.style.background='';"><IMG src="/image/002.jpg" width="200" height="200" border="1"></TD> </TR> <TR> <TD onmouseover="body.style.background='url(/image/003.jpg) fixed repeat';" onmouseout="body.style.background='';"><IMG src="/image/003.jpg" width="200" height="200" border="1"></TD> </TR> </TBODY> </TABLE> </BODY> </HTML> ---------------------------------- 「fixed repeat';」を「fixed repeat-x';」に変えてみても変化なしでした。 また、styleに <!-- BODY { background-attachment: fixed; background-repeat: repeat-x; background:position:top} --> を書いてみたりもしたのですが変化なしでした。 ご存知の方、詳しい方アドバイスお願いします。

    • ベストアンサー
    • HTML
  • 背景に複数の画像を入れることは可能でしょうか

    HTML、CSSの初心者の者です。 下記のように、CSSで背景に画像back1.gifを右上に入れているのですが、画面の右下にもう一つの画像back2.gifを入れることは可能でしょうか? もし可能なら、方法を教えて下さい。 初心者向けに易しくご説明頂けると幸いです。 body { background-color:yellow; background-image:url(image/back1.gif); background-attachment:fixed; background-repeat:no-repeat; background-position:right top; }

    • ベストアンサー
    • HTML