CSSメディアクエリは、私のような何かをして、私のCSSドキュメント内のメディアクエリを実行するために努力を続ける

を動作しません。私はサイズを変更し、ポートレート/風景の機能を使用しようとしましたが、まだ何もありません。私は間違って何をしていますか？デバイスごとに固定されている代わり"MAX-デバイス幅"のCSSメディアクエリは、私のような何かをして、私のCSSドキュメント内のメディアクエリを実行するために努力を続ける

出典

2013-08-13 Alex Clinton

あなたはそれで @media画面としてみてください、また、最大幅を使用することができます（最大幅を：250ピクセル） – NaYaN

は 'MAX-width'にそれを切り替えてみてください：http://jsfiddle.net/ z7pN9/ –

HTMLの先頭にCSSをリンクすると、私はいつも私を呼び出します。

現在のページからの例を私が働いている：

<link rel="stylesheet" type="text/css" media="screen and (min-device-width: 320px) and (max-device-width: 500px)" href="css/mobile.css" /> 
<link rel="stylesheet" type="text/css" media="screen and (min-device-width: 501px)" href="css/main.css" />

これは、代わりにCSSドキュメントがロードされた後のスタイルを選択するので開始から右にロードされるCSSドキュメントを選択（の数を減らします

CSSドキュメント自体でこれを行うときは、通常、max-device-widthをmax-widthに置き換えてください。

出典

2013-08-13 10:50:08 mikedugan

CSSファイルを分離して余分なHTTPリクエストを追加しています。それらを吐き出す正当な理由がない限り、2つを組み合わせるほうがよいでしょう。 – robooneus

これは私のために働いていましたが、コピーしてhref属性を変更することができました –

これは実際にメディアクエリを処理できる最悪の方法です。現在メディアクエリーの要件を満たしていない場合でも、すべてのデバイスはすべてのメディアクエリーをダウンロードします。 – cimmanon

使用"の最大幅"。

出典

2013-08-13 10:50:00

max-widthとmax-device-widthが同じハンドヘルドデバイスでは、これは実際には関係ありません。ブラウザが最大化される必要がないデスクトップでのみ重要です。 – cimmanon

これは私に感謝を助けました。私はブラウザで見ていた。とにかく、代わりにそれを使用しない理由がわかりません。代わりに、両方の代わりにmax-widthを使うことができれば、縮小されたデスクトップ画面でデスクトップサイズのインターフェイスを使うのは効率的ではないようです。 – Jackie

私は確信していませんが、私はmax-device-widthがiphoneの640pxだと思います。試してみる。

出典

2013-08-13 10:50:06

@media only screen and (min-width : 480px) { 

}

AndroidとiPhoneの両方でうまくいくようです。

出典

2013-08-13 10:50:47 Parfait

これは

/************************************************************************************ 
smaller than 980 
*************************************************************************************/ 
@media screen and (max-width: 980px) { 
your css here 
} 

/************************************************************************************ 
smaller than 650 
*************************************************************************************/ 
@media screen and (max-width: 650px) { 
your css here 
} 
/************************************************************************************ 
smaller than 560 
*************************************************************************************/ 
@media screen and (max-width: 480px) { 
your css here 
}

あなたはcode..butよくある間違いの人々は、このメタデータ

<meta name="viewport" content="width=device-width, initial-scale=1">

出典

2013-08-13 10:51:53 San

を追加しないことによってそれを行う提供していないと理解しにくいサンプルのメディアクエリーCSSですあなたのドキュメント

0の頭の中で

<meta name="viewport" content="width=device-width, initial-scale=1.0">

を持っていることを確認してください

幸運

出典

2013-08-13 10:52:41

を参照してください。これは重要です。ビューポートタグなしのメディアクエリは全く機能しないためです。 – user31782

ありがとう。どのように私はそれを逃したのか分からない。 –

CSSメディアクエリは、私のような何かをして、私のCSSドキュメント内のメディアクエリを実行するために努力を続ける

答えて

関連する問題