私はデザイナーではありませんが、CSSで調整するのに十分な知識があります。
私はiphone、androidなどのようなモバイル機器にそれを適応させるためにプロジェクトのために既存のcssデザインの上にメディアクエリを実装する必要があります。
既存のデザインにメディアクエリのサポートを追加するのに十分な時間がかかるまでにどのくらい時間がかかりますか。
質問を閉じないでください、それは私が今のところ私の目的を解決しないかもしれない何かを学ぶのに時間を浪費するのを潜在的に節約するので私が探している特定の答えです。
回答:
回答№1は0はい、できます。メディアへの問い合わせについて学ぶことはあまりありません。
彼らはあなたに「ブラウザがこれらの基準を満たすなら(そしてメディアクエリをサポートするなら)このCSSを適用する」と言わせます。
だから、あなたはいくつかのCSSをデバイスに適用することができます
device-width
この質問でメディアクエリを使用して480ピクセル以下にします。 ブラウザのスニッフィングなしに、(IEではなく)iPhoneだけにスタイルシートを適用するにはどうすればよいですか。多くのメディアクエリ(例:
width
)の接頭辞を取ることができますmax-
またはmin-
より小さい/より大きいクエリを許可します。そう、max-width: 480px
「幅480ピクセル以下のブラウザ」(および ない 「最大幅480ピクセルのブラウザ」)。あなたはそれらを使用することができます
media
の属性<link>
スタイルシート全体を条件付きでロードするための要素、または@media
CSSのブロックを条件付きで適用するためのスタイルシート内のat-rule。すべての内蔵iPhoneおよびAndroidブラウザがそれらをサポートしているので、モバイルデバイスに異なるスタイルを提供するのに適した方法です。 (また、通常のスタイルシートに追加することもできます。 防ぐ プロジェクトに適していれば、モバイルブラウザは通常のスタイルシートを適用できません。)
Media Queriesの仕様はここにあり、かなり読みやすいです。
どのメディアクエリを使用するかを考えるのではなく、ほとんどの作業で実際にサイトのデザインをモバイルデバイスに適応させます。