0

私のウェブサイトはほとんどのブラウザで正常に表示されますが、iPadとAndroidブラウザで2つの異なる問題があります。

  1. 最初はウェブページが1対1のスケールで表示されますが、訪問者にはウェブページ全体を見てもらいたいと思います。
  2. 背景が正しく表示されません。ズームアウトすると、背景の一部だけが読み込まれているように見えます。

私が使用した:

<meta name="viewport" content="width=device-width">

初期ズームの場合:

div.background {
    width: 100%;
    background: #ffffff url('../img/background_first.jpg') center top no-repeat;
}

背景に。私はイベントを追加しようとしました:

-webkit-background-size: 1500px 1000px;
background-size: 1500px 1000px;

しかし、背景の問題(これが私の主な関心事です)は残っています。何か案は?

4

1 に答える 1

1

.background固定幅を指定してみてください。

100% 幅はコンテナーの 100% であり、この場合はbodyです。モバイル デバイスでは、bodyはデスクトップよりもはるかに小さいため、背景画像がトリミングされます。

また、 `meta viewport` で固定幅を指定してみてください

<meta name="viewport" content="width=940, initial-scale=1">
于 2013-03-06T11:23:31.557 に答える