さまざまな解像度（デバイスは別として）でひどく見えるため、サイトを再設計しています。ほとんどのガイドとチュートリアルは、固定値に依存してい%ます。em私はまだこれを学んでいるので、私は周りのすべてを読んでいます。
これでさまざまな表示サイズの問題が解決すると思いましたが、特定の問題を修正するには、CSSをさらに作成する必要があります。
追加のディスプレイサイズのメディアクエリを追加する必要がある場合、なぜ％を使用するのですか？％を使用すると、コーディングが本当に減りますか？いくつかのサイズにいくつかのCSSを追加する必要がありますか、それとも何か間違ったことをしていますか？
アドバイスありがとうございます！
サイズを使用する目的はem、ユーザーが選択したフォントサイズに基づいてデザインを作成できるようにすることです。私はモニターが大きくて視力が悪いので、大きいフォントサイズを使用するかもしれませんが、他の誰かが小さいフォントを好むかもしれません。単位を使用することemで、デザインはフォントサイズを特定の標準（「12ポイントフォント」など）に強制するのではなく、フォント設定の両方に対応し、それに応じてサイズを変更します。
同様に、パーセント（％）単位を使用すると、デザインをさまざまなブラウザーサイズに対応させることができます。ユニットと組み合わせて使用すると、emテキストベースの要素が任意のフォントサイズの選択に応答し、レイアウト要素が任意のブラウザサイズに応答できるようになります。
すべてのメディアタイプに対して単一のレスポンシブデザインを設計することは完全に許容されます。メディアクエリは、さまざまなディスプレイサイズを「サポート」するのではなく、さまざまなデバイスでさまざまな表示スタイルが必要な場合に使用します。例としては、印刷メディアでセリフフォントを使用し、ディスプレイメディアでサンセリフフォントを使用することが挙げられます。これは、使いやすさの調査により、これらのフォント面がこれらの種類のメディアに適していることが示されているためです。
さらに、モバイルデバイスなど、ユーザーの帯域幅が限られていることや、余分な画像を削減できることを考慮したい場合に、カスタムスタイルを設定できます。または、特定の電話で提供される微細な画面とはまったく異なるレイアウトでコンテンツを表示したい場合。
%サイトがユーザーの表示方法に応答できるようにします。divにあるとしましょう100%。電話でもデスクトップでも、セクション全体に表示されます。
サイズにCSSを追加しても問題ありません。私の知る限り、一部の要素を表示し%たり、固定px値を使用したりすることができますが、ページの設定方法や表示内容によっては競合する可能性があります。
例えば。
ウェブサイトのヘッダーの幅は950pxです。ただし、モバイルデバイスでは、450pxに収まる場合があります。
したがって、media-queryを使用していくつかの要素を再配置し、いくつかのサイズの問題を処理し、ヘッダー幅を450pxに設定します。
ただし、％値を使用する場合は、ヘッダーdivを設定して、親に幅ベースの100％を含めることができます。したがって、本体または一部のコンテナdiv幅のみを変更でき、すべての子が適応します。
ダイアナ、
この質問に出くわしてよかったです。私は文字通り、フォントサイズと幅に関してパーセンテージに基づいて90％である私の最初のレスポンシブデザインをアップロードしました。
以下をチェックしてください： http ：//www.noxinnovations.com/portfolio/sensitive/
明らかに、見た目は素晴らしくなく、画像は見当違いに見えます...しかし、ブラウザウィンドウを徐々に小さくして、サイズを変更してください。私はパーセンテージ幅を設定することによってそれをしました！
信じてください。ピクセルを使ってこのレスポンシブデザインテストを試してみましたが、うまくいきませんでした。パーセンテージ幅により、解像度やピクセルの寸法（それ自体）に関係なく、デザインは常に画面のサイズに対応できます。また、CSS3メディアクエリを1つ使用する必要はありませんでしたが、CSS3メディアクエリは必要な場合にのみ使用することを強くお勧めします。
私の意見では、おそらくより大きな画面のメディアクエリが必要です。
これが私を助けてくれたのと同じくらいあなたを助けてくれることを願っています！ありがとう、アーロン