- ベストアンサー
スマホブラウザでの背景固定
以下のＣＳＳで背景画像を固定しようと思っています。 ＰＣでは問題なく固定されるのですが、スマホだと 背景画像が固定されず、画面をスクロールすると一緒にくっついてきます。 スマホの場合は別の対処が必要なのでしょうか？ body { margin:0 auto; text-align:center; padding:0; background: url(../images/photo01.jpg); background-repeat:no-repeat; background-position:center bottom; background-attachment:fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
- like-linux
- お礼率77% (28/36)
- CSS
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
こちらを参考にしてみてはいかがでしょうか？
関連するQ&A
- IEでのbackground-size使用について
IEでbackground-sizeが使えづに困っています。 Firefoxやクロームでは問題なく動作しているのですが IEのみ動作しません。 私の使い方が間違っているのでしょうか。 教えてください body { background: url(./images/wave.gif) no-repeat center center fixed #000; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; -webkit-font-smoothing: antialiased; position:fixed; margin:0; padding:0; border:0; }
- ベストアンサー
- CSS
- seesaaブログで背景画像の位置を指定したい
seesaaブログで背景画像の位置を下中央に表示させたいのですが、background-position:bottom center;と指定しても、上中央に固定されていてウンともスンとも動きません。 試しにleftに指定してみたり、タグの順番をかえてみたりしましたがダメでした。 ちなみに、忍者ブログや簡単なHTMLのページでは思い通りに表示できています。 ご存知の方、是非ご教授ください。よろしくお願い致します。 body { margin:0px; padding:0px; background-image:url("画像URL") ; background-color : #210709; background-repeat:no-repeat; background-attachment:fixed; background-position:bottom center; line-height:180%; text-align:center; }
- 締切済み
- CSS
- 背景を固定した時の表の背景
こんにちは。ＨＰを制作し始めたばかりの初心者です。 質問です。 背景をこんな感じて固定した時 <STYLE type="text/css"> <!-- BODY{ background-image : url(○○.jpg); background-repeat : no-repeat; background-attachment : fixed; background-position : 90% 50%; } --> 作ってる表の背景画像が無効になっちゃいます。 なんか間違ってるんでしょうか？？？ お答えを頂けると有り難いのですが。
- ベストアンサー
- HTML
- ブログの背景画像のサイズを固定したいです
宜しくお願いします。 ブログの背景画像を変更したく、一枚の写真（フリー素材です）を使用しブログの背景に設定したのですが、スマートフォンの所謂PC表示にすると画像が拡大してしまいぼやけた状態になってしまいます。 デスクトップ、ラップトップPCのブラウザですと普通に表示されます。 スマホ用PCブラウザではなぜか画像が異常に引き伸ばされてしまうのです。 CSSではライブドアブログのかんたん背景画像という機能を使用しており、 /* かんたん背景画像 */ body.show-bg-image { background-attachment: fixed; background-repeat: no-repeat; background-size: cover; のように設定されています。 スマートフォン用のPCブラウザからでもデスクトップPCブラウザで見たときのように画像を固定（一枚絵）し、サイズもスマートフォン向けPCブラウザで見たときに適合するようにしたいのですが方法が分かりません。 自分でも色々調べ、リピートの設定やスクロール、コンテイン等をいじってみましたが素人知識ではまったく改善されず困っております。 お詳しい方是非ご教授、お力添えを頂きたく存じます。 宜しくお願い致します。
- ベストアンサー
- CSS
- IE以外のブラウザで背景を固定させる方法
スタイルシートで、ブログのタイトル部分の背景を固定しています。 IE6.0では画像が表示されるのですが、NetscapeやFirefoxでは表示されず、指定してある背景色だけになってしまします。 #title {background: #000 url("画像のURL") no-repeat; background-position:top;background-attachment : fixed;} このように記述していますが、IE以外のブラウザで表示させるにはどのようにすればいいのでしょうか。
- ベストアンサー
- ブログ
- 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
- 固定背景画像と画面幅について
初心者のため、分かりづらい質問になると思いますがお許しください。 background-repeat:no-repeat; background-position:right; background-attachment:fixed; 上記のようなCSSで背景画像を固定しています。 画面幅は918pxで設定していますが、これをプレビューで918px以上に伸ばすと、背景画像がどんどん右にズレていってしまいます。 画面環境はそれぞれだと思うので、大きな画面で見た方が背景画像が切れてしまうのを避けたいです。 画面幅918pxで固定をしたいのですが、どのようにすればいいのでしょうか？ 何か補足事項があればすぐに追記します。 よろしくお願いします。
- ベストアンサー
- CSS
- ２つの背景画像固定がうまくいきません
(1)一番下に細かい画像をrepeatさせた背景を、 (2)その上に大きい画像をno-repeatで中央に表示させ、 どちらも固定させて、その上にテキストやテーブルを表示したいのですが、(2)のbackground-attachment : fixed だけうまくいかずスクロールされてしまいます。 過去の質問に同様の内容があり、それへの回答を参考にしたのですが・・・。 http://oshiete1.goo.ne.jp/qa1133735.html どなたか解決方法を教えて下さい。
- ベストアンサー
- ホームページ作成ソフト
- ホームページビルダーＶ９での背景固定について
ホームページビルダーＶ９を使っています。 そこで、背景を固定したいのですが上手くいきません。 ソースに下のようなタグを入れても画像が表示されないんです。 どうしたら良いか教えてください。 <STYLE type="text/css"> <!-- BODY { background-color: #------; background-image : url("画像のURL"); background-attachment: fixed; background-position: 50% 50%; background-repeat: no-repeat; } --> </STYLE>
- 締切済み
- ホームページ作成ソフト
- 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> とでてくるんですが・・・
- 締切済み
- その他([技術者向] コンピューター)
お礼
素早いアドバイスありがとうございます。 参考にしてみます。