メディアクエリを画面解像度にフックするにはどうすればよいですか？

Question

私はしばらくの間クエリを使用していましたが、どのタイプ（電話、ノートパソコン、タブレット、通常の画面）であろうと、あらかじめロードされている幅などをつかんでいました。高さ？だから私はそれを最大幅、最大の高さに変更し、今それは異なる画面と競合しているようです。だから私はそれをmin-widthとmax幅に戻しましたが、同じ問題です。

私はこれらの使用方法について完全に混乱しています。チュートリアルやあらゆる種類のチュートリアルを見ていますが、まだ正しく理解していません。誰かが私を助けることができますか？

以下は2つのクエリで、その競合と、私が推測している理由は最大幅が同じであるためです。

私はちょうど最高の高さに変更され、それでも私は正直には分かりませんので、仕事はありません。

メディアのクエリを作成する画面のサイズは、次のとおりです。 1280 x 768と横向きです。 1280×720

メディアクエリを画面用に1280×768：

@media only screen 
    and (min-width: 768px) 
    and (max-width: 1280px) 
    and (orientation: landscape) 
{ 
/*css here*/ 
} 

コード画面用に1280×720：

@media only screen 
    and (min-width: 720px) 
    and (max-width: 1280px) 
    and (orientation: landscape) 
{ 
/*css here*/ 
} 

私は何をしようとしなかった私もやってみたいですか？私は間違って何をやっている

@media only screen 
and (max-height: 720px) 
and (orientation: landscape) 
{ 
/*Screen 1280 x 720*/ 
} 



@media only screen 
and (max-width: 1280px) 
and (orientation: landscape) 
{ 
/*Screen 1280 x 768*/ 
} 

：

は私が失敗した次のことをやってみましたか？私は最大幅：1280と最大高さ：768は、他の解像度についても同じように見えるようにすることはできません...それは画面 "1280 x 768"のように画面のCSSをピックアップ " 1280 x 720 "

すべてが高く評価されます。ありがとう。

Answer 1

私はちょうどそれがどんな両方に合わせないように何でも小さくすることにより、両方のために働かせたので、それは両方のクエリを拾ったいくつかの奇妙な理由サイズはだった。

例：私は高さ1200を作る場合

background-color: red; 
height: 500px; // I want this for one red and 1200 for another lets say 

それは割合からそれを吹くが、とにかく私がしたすべては、言う300ピクセルの高さのままにして壮大だっできました。 （最高ではありませんが、大丈夫です）。

誰かが解決策を持っていれば、今までのところこれが唯一の方法であることを私に教えてください。ただ1つのメディアクエリを使用するという事実のために最良の（明らかに）解決策ではありません。

Answer 2

あなたの最初のルールは、2番目のルールと矛盾しています。

1280px x 768はw x hと同じです。したがって、高さは最小幅ではなく768ですが、これは必ずしも必要ではありません。

@media only screen 
    and (min-height: 720px) 
    and (max-width: 1280px) 
    and (orientation: landscape) 
{ 
/*css here*/ 
} 

（あなたはここでの最大の高さを使用することができます）

@media only screen 
    and (min-height: 768px) 
    and (max-width: 1280px) 
    and (orientation: landscape) 
{ 
/*css here*/ 
}