19

デスクトップブラウザの場合、最新のブラウザはすべてズーム機能を使用しているため、PXを使用できますが、同じサイトがモバイルで表示される場合、pxはモバイルブラウザでのズームには適していません。または、pxの使用はモバイルブラウザでも問題ありません。

IE 6を気にしない場合でも、モバイル用に別のサイトを作成していない場合は、pxの代わりにemを使用すると、デスクトップと携帯電話(iphone、blackberry、windows mobile、opera)の両方で同じサイトが表示されます。ミニ、アンドロイドなど?

4

5 に答える 5

38

このトリックを使用して、CSS でフォ​​ントを px から em に変換できます。

body {
  font-size: 62.5%; /* resets the page font size */
}

次に、次のようにフォント サイズを指定します。

p {
  font-size: 0.8em; /* equals 8px */
  font-size: 1.0em; /* equals 10px */
  font-size: 1.6em; /* equals 16px */
  font-size: 2.0em; /* equals 20px */
}

等々。次に、 PXtoEm.comでレイアウト用に px を em に変換できます。

于 2011-05-12T23:22:58.650 に答える
6

px最新のモバイル ブラウザで画面を縮小すると、実際の実際のピクセルにはなりません。これらのブラウザは、デスクトップ ブラウザ サイズのピクセルでデスクトップ ブラウザを効果的にエミュレートしています。

したがって、このタイプのブラウザの使用pxは、通常のデスクトップ ブラウザの場合よりも悪くありません。大きな問題がなければそれを行うこともできますが、両方の状況emで可能であれば、本体のコンテンツが望ましいです。

于 2010-03-25T14:06:56.413 に答える
5

PX は固定ピクセル サイズです EM はフォント サイズに関連しています

ですから、おそらくもっと多くの Web サイトで EM を使用する必要があります。これにより、ユーザーは必要なフォントの大きさを定義できるようになり、サイトはそれに合わせて拡大縮小できます。

ただし、ほとんどの Web 開発者は、物事が互いにどのように表示されるかを正確に知ることができるため、より具体的な PX を好みます。

しかし、デスクトップとモバイルでは解像度が大幅に異なるため、モバイル ブラウジング用にサイトを再設計する方が簡単になるでしょう。

于 2010-03-25T13:52:57.700 に答える
4

一般的に、特にモバイル デバイス向けに開発する場合は、ピクセル精度のデザインを使用しないことをお勧めします。理由は簡単です。

  • 小さな解像度から 1920x1080 を超える画面までの範囲のデバイスを扱っており、「フリーサイズ」のアプローチはありません。また、ブラウザにズーム機能が存在することさえユーザーが知らない可能性があることも考慮してください。
  • モバイル デバイス用に開発する場合は、さまざまなフォント サイズをサポートするデバイスが多くないことに注意してください。そのため、ピクセル単位の正確なフォントに依存することはできません。Line-Height は、一部のモバイル ブラウザーではまったくサポートされていません。したがって、たとえばメニュー バーなどのデザインがピクセル精度に依存していて、バーの高さが x ピクセルになるようにデザインすると、結果が完全に間違って見える場合があります。

Dan Cederholm の本「Bulletproof Web Design」は、タイトルが示すほど防弾ではないかもしれませんが、質問に答えたり、問題を解決したりするための本当に良い出発点です。

于 2010-05-19T22:00:28.250 に答える
1

ピクセルは固定されており、1 つのピクセルはモバイルでもディスプレイでも同じ場所を使用します。em は相対的なもので、大文字の「M」のおおよそのサイズを使用するため、そう呼ばれています。

ems は画面に応じて調整され、フォントは ems により適合する可能性が高いため、ems を使用する必要があります。

于 2010-03-25T14:00:46.310 に答える