ホームページ > ウェブフロントエンド > CSSチュートリアル > iOS の Firefox と Safari で背景画像の右側に空白があるのはなぜですか?

iOS の Firefox と Safari で背景画像の右側に空白があるのはなぜですか?

Patricia Arquette
リリース: 2024-10-26 17:54:03
オリジナル
743 人が閲覧しました

Why Does My Background Image Have White Space on the Right in Firefox and Safari on iOS?

ページの側面の空白: 背景画像拡張子の問題

この問題は、ページの右側に空白が表示される場合に発生します。 iOS では背景画像を表示しながら FireFox や Safari などのブラウザを使用できます。他のブラウザでは画像は正しく拡張されますが、影響を受けるブラウザではブラウザの最大幅に達しません。

この問題を解決するには:

  1. CSS ファイルが次の場所に含まれていることを確認してください。他のすべてのクラスの上にある、HTML ドキュメントの先頭です。
  2. 次のコードを CSS ファイルに追加します。
<code class="css">html, body {
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    overflow-x: hidden;
}</code>
ログイン後にコピー

このコードは、HTML の幅と高さを設定し、 body 要素を 100% に設定し、ページの幅全体を占めるようにします。また、マージンとパディングが削除され、水平方向のオーバーフローが非表示になります。

これらの変更を加えた後、背景画像は右側に空白がなく、ページ全体に完全に広がるはずです。

以上がiOS の Firefox と Safari で背景画像の右側に空白があるのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート