html - Ipad screen resolutions and desktop versions

Question

Why would this not work.

body{
    @media screen and (min-width: 1024px) {
        min-width:1339px;
    }
}

I want if the user is on an Iphone or Ipad 2 to set the min-width:1339px; but if on deskop browsers to not add any min-width.

Answer 1

メディア クエリでは、それらをセレクター内に配置することはできません。

編集：読み直した後、これをiPad/iPhoneに適用したいこともわかったので、最小幅ではなく最大幅が必要です。

@media screen and (max-width: 1024px) {
    body {
        min-width:1339px;
    }
}

Answer 2

body タグの外に持ってきます。

@media screen and (min-width: 1024px) { body { min-width:1339px;} }

Answer 3

この最小幅の測定値を設定するには、メディア クエリに変更する ID またはクラスが必要です。また、測定値を中括弧で囲む必要があります。

Example:

 @media screen and (min-width:1024px){
     body{min-width: 1339px;}
}

メディア クエリと最初の中かっこの間にスペースを入れないでください。メディア クエリが無効と解釈されるためです。また、すべてのスタイリングを中かっこの外側に配置するようにしてください。そうしないと、中かっこの外側に配置すると、ページ全体にスタイルが適用されます。

それが役立つことを願っています。

更新しました：

幅が問題になるのではないかと思いますが、その結論にジャンプする前に. あなたが見逃していたものを見つけたと思います。この更新された例を試してください：

    @media screen only and (min-width: 1024px) {
     body{min-width: 1339px;}
    }

それがうまくいかない場合は、幅を編集してみます。iPad画面の最小幅よりも大きいため、最小幅の測定値は表示されないと思います。幅を変更しようとすると、ベース幅を設定します:1339px; そして最大幅: 85%; そして、そこから下に向かって進みます。そうすることで、1339px の幅が使用され、iPad 用に指定したパーセンテージに縮小されます。レイアウトがレスポンシブになります。これは、私が読んだことから、あなたがやろうとしていることだと思います。

これがうまくいくかどうか教えてください。