メディアクエリは1024x768のシステム解像度ではサポートされていません

Question

私はバックグラウンドカラーを適用しました：タブレットの場合はグレー、メディアクエリの場合はシステムブラウザの青色です。それは正常に動作しています。今問題は、私のシステム解像度を1024x768に調整したときに、青色ではなくタブレットカラーグレーがシステムブラウザにも適用されていることです。私に提案してください。以下は

私のCSSです：

.Box{background-color:#709bd3;height:200px} 

@media screen and (min-device-width:600px) and (max-device-width:1024px) { 
.Box{background-color:#ccc} 
} 

Answer 1

開始のために、あなたはすべての文の末尾にセミコロンが含まれることを確認してください。

.Box { 
background-color:#709bd3; 
height:200px; 
} 

@media only screen and (min-device-width:768px) and (max-device-width:1024px) { 
    .Box { 
    background-color:#ccc; 
    } 
} 

最小デバイス幅をiPadの最小値である768pxに変更しました。

EDIT - ユーザーエージェント文字列を使用する必要があるように見えます。次のようにしてください：

http://www.htmlgoodies.com/beyond/webmaster/toolbox/article.php/3888106/How-Can-I-Detect-the-iPhone--iPads-User-Agent.htm