2

私は周りを見回しましたが、この質問に対するより簡潔な答えが必要です。

現在のプロジェクトで複数のメディアデバイス用にCSSを構築するための最良の方法を模索しています。次のスタイルシートを作成できるようにしたい:

  1. CSSリセット(使用するものすべて)
  2. 通常のデスクトップの「画面」。(デスクトップコンピューターのみ)
  3. 印刷'印刷'(印刷のみ)
  4. iPhone /ハンドヘルド(ハンドヘルドのみ)
  5. IE6スタイルシート(IE6のみ)

ですから、私の質問は次のとおりです。これを制御する正しい方法を考えるのは正しいのでしょうか。

  • resets.cssにmedia="all"を設定します
  • desktop.cssのmedia="screen"を設定します
  • レガシーブラウザの場合は、条件付きコメント「ここ」を使用します。
  • Printing.cssのmedia="print"を設定します
  • 次のようなcss3メディアクエリを使用します:@media only screen and(min-device-width:320px)and(max-device-width:480px){}

メソッドを共有できる複数のデバイスCSSをセットアップした経験がもう少しある人はいますか?これを自分でどのように整理しますか?

4

1 に答える 1

3

それはいくつかの要因に依存する可能性がありますが、その中でも特に、デザインがどのように流れるかが異なります。これは、モバイルからの設計に関する優れた記事です。

http://stuffandnonsense.co.uk/projects/320andup/

これらの人々がどのように定型文を開発したかを見るだけで、多くのことを学ぶことができます。

また、サイズ変更や向きの変更に対してさまざまなメディアクエリがどのように反応するかを確認するには、次のページのデモを試してください。

http://www.jensbits.com/2011/04/20/media-query-playground-rotate-resize-rinse-repeat/

メディアクエリ属性を調整して、それらがページにどのように影響するかを把握できます。

于 2011-04-20T16:37:46.243 に答える