html - モバイルIOSデバイスで回転した後の画像サイズが同じではない

Question

私はウェブサイトを作成し、iPadのサファリブラウザで表示しています。

縦向きでは、サイトは正常に見えます。ただし、デバイスが回転すると、Webページのサイズ（幅と高さ）が異なります。

横向きのビューはポートレートの約1.3倍のサイズのようです。

両方の方向でサイズを同じにするにはどうすればよいですか？

score 2 · Accepted Answer

これが役立つかもしれません：

var w = $('img').width();
var h = $('img').height();

$(window).orientationchange(function(e) {
     $('img').css({'width':w, 'height':h});
});

score 1 · Accepted Answer

1

画像の幅をピクセル単位で指定するだけです。

于 2013-03-06T07:32:43.327 に答える

score 1 · Accepted Answer

2つのオプションのみ。

「ビューポート」を含める: https://developer.mozilla.org/en-US/docs/Mobile/Viewport_meta_tag
メディアクエリを使用 http://css-tricks.com/snippets/css/media-queries-for-standard-devices/メディアクエリを使用して、さまざまなサイズに応じて CSS に必要なものを調整できます。

score 1 · Accepted Answer

使用する

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

4 に答える 4