- ベストアンサー
IE以外のブラウザで背景を固定させる方法
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
何故Firefoxで画像が表示されないのかはわかりませんが、原因切り分けのためにプロパティを分けてみてはいかがでしょうか？ #title { background-color: #000; background-image: url("画像のURL"); background-repeat: no-repeat; background-position: top; } それと、background-attachment: fixed; を指定してしまうと、ブラウザ画面に対して位置が固定されてしまうので、「ブログのタイトル部分に固定：タイトルの文字と一緒にスクロールする」なら、background-attachmentを指定しないかbackground-attachment: scroll; じゃないでしょうか…。
その他の回答 (2)
- hikaly
- ベストアンサー率39% (47/119)
＃１です。 す、すいません。ブログの話でしたか。(^_^;) えっと、私の環境でFirefoxでtest.htmlを表示させたときに画像が表示されましたし、ari13さんの環境でもIEでは正常とのこと。スタイルシートの記述が間違っているわけではないと思います。 ブログのURLを示していただければ原因が何か分かるかもしれません。
お礼
ブログのURLを出せば早いと思うのですが・・・後で削除できないので、すみません。ご丁寧に教えて下さってありがとうございます。
- hikaly
- ベストアンサー率39% (47/119)
私のFirefox 1.04 (Windows版）だとしっかりと表示されますけど。 同じディレクトリに ・test.html ・test.css ・test.jpg を用意。 test.htmlを次のように記述。 ---- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja-JP" lang="ja-JP"> <head> <link rel="stylesheet" type="text/css" href="./test.css" /> <title>test</title> </head> <body> <h1 id="title">sample</h1> </body> </html> ---- test.cssはari13さんのスタイルシートを流用。画像のURLだけ変更。 ---- #title {background: #000 url("test.jpg") no-repeat; background-position:top;background-attachment : fixed;} ---- これでどうですか？
関連するQ&A
- ホームページビルダーＶ９での背景固定について
ホームページビルダーＶ９を使っています。 そこで、背景を固定したいのですが上手くいきません。 ソースに下のようなタグを入れても画像が表示されないんです。 どうしたら良いか教えてください。 <STYLE type="text/css"> <!-- BODY { background-color: #------; background-image : url("画像のURL"); background-attachment: fixed; background-position: 50% 50%; background-repeat: no-repeat; } --> </STYLE>
- 締切済み
- ホームページ作成ソフト
- 背景を右下に固定する方法
ビルダーでＨＰ作成をしています。 どこかのＨＰで、下記のタグを使用しましたが、 保存すると、３行目の background-image:url("張りたい画像のURL"); の部分が消えてしまい、うまく表示されません。 どうしたらうまく行くでしょうか。 <style type="text/css"> <!-- BODY{background-image:url("張りたい画像のURL"); background-position:100% 100%; background-repeat :no-repeat; background-attachment:fixed;} --></style>
- 締切済み
- ホームページ作成ソフト
- 背景を固定した時の表の背景
こんにちは。ＨＰを制作し始めたばかりの初心者です。 質問です。 背景をこんな感じて固定した時 <STYLE type="text/css"> <!-- BODY{ background-image : url(○○.jpg); background-repeat : no-repeat; background-attachment : fixed; background-position : 90% 50%; } --> 作ってる表の背景画像が無効になっちゃいます。 なんか間違ってるんでしょうか？？？ お答えを頂けると有り難いのですが。
- ベストアンサー
- HTML
- IE以外のブラウザで、背景を固定させる方法
まったく同じタイトルで、質問されているカタがいらっしゃいましたが、回答を読んでも分からなかったので質問させていただきます。 MS FrontPage 2000でHPを作ったのですが、IEではうまく背景固定がされるのですが、Firefoxでは、背景固定ができず、スクロールすると背景が動きます。 HTMLの部分を見ると、 <body bgcolor="#FFFFFF" text="#000000" background="bear.jpg" bgproperties="fixed" background-attachment:fixed > と言う記述があり、この部分がカギになっているようなのですが、どう変えれば、IEでもFirefoxでも固定されて表示されるのか分かりません。お教えいただけないでしょうか？
- ベストアンサー
- その他（インターネット・Webサービス）
- Firefoxで背景画像が表示されず困っています
サイトを作り確認してみたところ、 IEでは背景画像がきちんと表示されるのですが Firefoxでは表示されないようです。 下記のように入力しているのですが、何が原因なのかわかりません…。 詳しい方、教えていただけないでしょうか。 <!-- BODY { background-image: url(http://aaaaa.jpg); background-color: #ffffff; background-repeat: no-repeat; background-position: center bottom; background-attachment: fixed; } -->
- ベストアンサー
- HTML
- 時間帯によって背景画像を変える
タイトル通りなのですが、なかなかうまくいきません・・・。 <BODY style="background-image:url(test.gif);background-repeat:no-repeat; background-attachment:fixed;background-position:bottom right;"> スタイルを使って右下に背景画像を表示しています。このtest.gifを時間帯によって変えたいです。 自分なりにこのようにしてheadタグの中に埋め込みましたがうまくいきません。 <SCRIPT LANGUAGE="JavaScript"> <!--- function geth(t){ if (t<=5) document.write("<BODY style='background-image:url(test1.gif);background-repeat:no-repeat; background-attachment:fixed;background-position:bottom right;'>"); else { if (t<=11) document.write("<BODY style='background-image:url(test2.gif);background-repeat:no-repeat; background-attachment:fixed;background-position:bottom right;'>"); else { if (t<=17) document.write("<BODY style='background-image:url(test3.gif);background-repeat:no-repeat; background-attachment:fixed;background-position:bottom right;'>"); else { if (t<=23) document.write("<BODY style='background-image:url(test4.gif);background-repeat:no-repeat; background-attachment:fixed;background-position:bottom right;'>"); }}} } //---> </SCRIPT> <SCRIPT LANGUAGE="JavaScript"> <!--- h = new Date(); geth(h.getHours()); //---> </SCRIPT> <BODY BACKGROUND='test.gif'>という普通の背景の表示の仕方ならうまくできました。スタイルはheadの中では使えないのでしょうか・・・？どのようにすればうまくいくでしょうか？JavaScriptに関してはほとんど無知ですがよろしくおねがいします。 ※意味不明なことを言っていたらすみません。
- ベストアンサー
- JavaScript
- 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
- 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> とでてくるんですが・・・
- 締切済み
- その他([技術者向] コンピューター)
- 壁紙を二つ固定したい。（ＨＴＭＬ）
ホームページを作っていてＨＴＭＬで壁紙を左横と真ん中に固定して、二つ表示されるようにしたくて、下記の設定をしたのですが、どちらか一つしか表示されません。説明がわかりにくくてすみません。 どうしたらいいでしょうか？？ お手数をおかけしますが、よろしくお願いします。 <head> <style type="text/css"> <!-- body{ background-image: url(画像のＵＲＬ); background-attachment: fixed; background-repeat: no-repeat; background-position: 55% 50%; body{ background-image: url(画像ＵＲＬ); background-attachment: fixed; background-repeat: repeat-y; background-position: left; } --> </style> </head>
- ベストアンサー
- その他（インターネット・Webサービス）
- 写真素材の背景
写真素材の背景で、例えば右下に表示するためのタグがありますよね？ それって↓ <STYLE type="text/css"> <!-- BODY { background-image : url("素材URL"); background-attachment: fixed; background-position: 100% 100%; background-repeat: no-repeat; background-color:背景色; } --> </STYLE> でいいんですか？？↑で何度かやってみたんですが、ちゃんと右下に表示されません。
- 締切済み
- その他（インターネット・Webサービス）
お礼
教えていただいたとおりにプロパティを分けたら、表示されました。ありがとうございました。