1

画面の幅 100% に収まるモバイルで Web ページを作成しています。

ただし、JavaScript でいくつかの要素を作成し、幅を に設定すると、CSSwindow.innerWidthで設定された静的要素よりもはるかに幅が広くなります。width: 100%(iPhone 6)

画面のwidth: 100%解像度が 1334 x 750 であるため、これらの要素を 375px に設定します。これは正しいと思いますwindow.innerWidth。

これは私がテストしているブラウザのバグですか、それとも Retina スクリーンの何かが欠けていますか?

ちなみに、私width:480px;max-width:100%は静的要素を設定するために使用します。ビューポートのメタは次のようになります<meta name="viewport" content="width=device-width, initial-scale=1.0">

4

1 に答える 1

0

ピクセル比とサイドバーにより、デバイスによってウィンドウの内側の幅が異なる場合があります。メディアクエリが一致するように、javascript でウィンドウ幅を確認する必要がある場合。window.matchmedia 関数を使用します。

JS

  if ( window.matchMedia('max-width:800').matches ){
        console.log('tablet mode');
  }
于 2015-11-20T03:08:32.800 に答える