ホームページ >ウェブフロントエンド >CSSチュートリアル >iOS7 で固定背景画像がぼやけるのはなぜですか?どうすれば修正できますか?
iOS7 での背景画像の問題の修正
iOS7 で固定背景画像を使用すると、問題が発生する可能性があります。この問題は、特に iPad で背景画像が拡大されてぼやけて見える場合に発生します。これに対処するには、使用されている CSS コードを調べる必要があります。
ユーザーが提供したコード スニペットには、次の CSS 宣言が含まれています:
.header { display: table; height: 100%; width: 100%; position: relative; color: #fff; background: url(../images/boston2.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
問題のある組み合わせは、背景の使用です。 -添付ファイル:背景付き固定-サイズ:カバー。このペアリングにより、iOS7 を含む多くのモバイル ブラウザとの互換性の問題が発生します。
解決策 1: Background-Attachment: Scroll
1 つのオプションは、background-attachment: fix を置き換えることです。背景添付: スクロール。これでは望ましい「固定」効果は得られませんが、少なくとも画像は表示されます。
解決策 2: 背景の位置: JavaScript でスクロールします
またはでは、background-position:scroll を使用して JavaScript を実装し、画像の位置をビューポートの上部に維持することができます。このアプローチには、少し高度なコーディングが必要ですが、より視覚的に魅力的なソリューションが提供されます。
以上がiOS7 で固定背景画像がぼやけるのはなぜですか?どうすれば修正できますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。