背景画像がページ全体をカバーしないのはなぜですか？

私はバックグラウンドとして画像を持っているHTMLページを持っています。 iPhone 6でページを表示するたびに、背景画像がページ全体をカバーしないことがあります。これは時間の約20％に過ぎず、ページをリロードした後には発生しません。私はいつも私の携帯電話でキャッシュとウェブサイトのデータをクリアするときに発生します。これは、背景にそれを設定するためのCSSです（私は「良いCSSの背景画像を作成する方法」検索してウェブからそれを得た）背景画像がページ全体をカバーしないのはなぜですか？

html { /*Copied from the web*/ 
    background: url(img/sea.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
} 

body{ 
    background: none; 
}

ページのURLがmsolonko.net/signup.phpです。

画像のように、ログインボタンの下に空白があります。なぜ画像は正しく動作するのですか？これをどうすれば解決できますか？

EDIT：

は、画像の解像度を変更するには、問題には影響を与えません。イメージを繰り返す必要はありません。問題が発生しない場合は、1つの画像でうまく見えます。

また、この問題を解決できない場合は、画像がコンピュータの場合にのみ表示されます。デバイスの幅がある閾値よりも小さい場合は、画像の代わりに背景色を使用します。私はまだ私がこれを修正することができると期待しています。

出典

2016-08-11 Nick Solonko

ページを読み込む前に画像を編集し、正しいサイズにしてください。は再帰的です。（私は同じ問題を抱えており、コード内の解決策を見つける方法が見つからないためこのようにしています）私はphotoshopとcorelのようなプログラムを使用しています。

出典

2016-08-11 03:30:34 dashboy

2つの解決策：イメージが繰り返すようにします（繰り返しを繰り返すことはしません）。または sky.jpgの高さを増やすには、sky.jpgの高さが携帯電話に適合しないため高くします。

私が間違っていない場合は（おそらく私は）、sky.jpg画像を960 x 660 pixにする必要があります。平均電話ピクセル解像度はhttp://www.binvisions.com/articles/tablet-smartphone-resolutions-screen-size-list/

です。それができなかったら申し訳ありません。

編集：少なくともテクニックを試しましたか？（私はスタックに新しいです、私はコメントすることはできません）

出典

2016-08-11 03:38:22 Christian

電話機に十分な高さでない場合、どのように時間の80％が良く見え、まれにしか画面に合わないのですか？十分な高さでない場合、私は問題が常に発生すると仮定します。 –

私は技術を試し、何が起こるかを教えてくれます。私は私のサイトの他のページの1つに似たイメージを持っており、問題なく動作します。私はまだ試して結果を教えてくれるでしょう。 –

異なる解像度で実験したところ、問題は解決しませんでした。 –

私はそれを得ました！私はいくつかのCSSを学んでいた... CSSコード：

body { 
    background-image:sky.jpg; /*or whatever*/ 
}

する必要があります...多分。

出典

2016-09-02 01:24:37 Christian

背景画像がページ全体をカバーしないのはなぜですか？

答えて

関連する問題