0

iPad 2 で大きな jpg を適切に表示するのに苦労しています。ファイルは 9577x600 ピクセルで、div の背景画像として設定されています。その div で定義-webkit-background-sizeし、画像と同じサイズに設定しました。また、ビューポートのメタ タグを次のように設定しました。

<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"/>

私のcssは：

#content { position: relative; background: url(../images/infographic.jpg) left top no-repeat; width: 9577px; height: 600px; -webkit-background-size: 9577px 600px; }

これは、デスクトップで見ているものと比較して、iPad で得ているもののスクリーンショットです。

ここに画像の説明を入力

誰がこれを引き起こしているのか知っていますか?

4

3 に答える 3

0

電話や iPad などのデバイスには、常に 2 倍のサイズの画像 (HD 画像) を使用する必要があります。

たとえば、表示画像の寸法が 200*200 の場合、400*400 寸法の元の画像を取得し、max-widthまたはwidthプロパティを使用して画像の元の寸法を設定する必要があります。

詳細については、この記事をお読みください

于 2012-10-22T11:21:39.423 に答える
0

metaそこにあるタグラインなしで、および/または-webkit-background-size属性なしで試しましたか?

于 2012-10-22T11:44:03.690 に答える
0

問題は解決しました - 大きな画像を 2 つに分割し、それらを 2 つの異なる div の背景画像として使用する必要がありました。iPad は大きなピクセル寸法に苦労したに違いありません。

于 2012-10-22T13:39:31.283 に答える