CSSのフォントサイズ-％またはem？

CSSでフォントのサイズを設定するとき、パーセント値（%）を使用する必要がありemますか？利点を説明できますか？

A List Apartには、Webタイポグラフィに関する非常に優れた記事があります。

彼らの結論：

本文でパーセンテージを指定したemsでのテキストと行の高さ（およびSafari 2のオプションの警告）のサイズ変更は、現在一般的に使用されているすべてのブラウザーで正確でサイズ変更可能なテキストを提供することが示されています。これは、キットバッグに入れて、デザイナーとリーダーの両方を満足させるCSSでテキストのサイズを変更するためのベストプラクティスとして使用できる手法です。

http://archivist.incutio.com/viewlist/css-discuss/1408から

％：一部のブラウザーはfont-sizeのパーセントを処理しませんが、150％を150pxとして解釈します。（たとえば、一部のNN4バージョン）IEには、ネストされた要素のパーセントに関する問題もあります。IEは、親要素に対する相対ではなく、ビューポートに対する相対パーセントを使用しているようです。さらに別の問題（W3C仕様によると正しい）ですが、Moz / Ns6では、高さ/幅が指定されていない要素に対するパーセントを使用できません。

em：ブラウザーは誤った参照サイズを使用することがありますが、相対単位のうち、問題が最も少ないものです。ただし、pxとして解釈される場合もあります。

pt：解像度間で大きく異なるため、表示には使用しないでください。ただし、印刷物を使用する場合は非常に安全です。

px：画面上の唯一の信頼できる絶対単位。ただし、1つのポイントは通常複数のピクセルで構成されているため、すべてが途方もなく小さくなるため、印刷では誤って解釈される可能性があります。

どちらも、フォントサイズを相対的に調整します。1.5emは150％と同じです。唯一の利点は読みやすさです。最も使いやすい方を選択してください。

実際の違いは、フォントサイズではなく使用すると明らかになります。の設定はと同じpaddingで1emはありません100%。em常にフォントサイズに相対的です。しかし%、フォントサイズ、幅、高さ、そしておそらく私が知らない他のいくつかのものに関連しているかもしれません。

（ほぼ？）すべてのブラウザがテキストだけでなくページ全体のサイズを変更することを考えると、アクセシブルなフォントのサイズ変更に関するpxvs %とems に関する以前の問題はかなり問題になっています。

したがって、答えはおそらくそれは問題ではないということです。あなたに合ったものを使ってください。

% それは相対的なサイズ変更を可能にするのでいいです。

px それを使用するときに期待を管理するのはかなり簡単なので、いいです。

em テキストサイズに関連するサイズ変更を可能にするため、レイアウト要素にも使用すると便利です。

CSSユニット%との違いについてem。

私の知る限り、あなたが乗算あなたの場合には、これら2つのユニットはすなわち、等価です（少なくとも理論的/概念的、しかし、おそらくこれらの2つのユニットはブラウザに実装されるかもしれないではないか）を理解するようemで値100、次に置き換えるemと%、それは同じものでなければなりませんか？

emと％の間に実際の違いがある場合、誰かがそれを説明できますか（または説明へのリンクを提供できます）？

（私のコメントが属する場所、つまり回答のすぐ下にインデントされたコメントを追加したかったの"Liam, answered Sep 25 '08 at 11:21"は、彼の回答が反対票を投じられた理由も知りたいからですが、コメントをそこに配置する方法を理解できなかったため、この「スレッドグローバル」応答）

Galwegianが言及しているように、pxはWebタイポグラフィにとって最も信頼性が高く、ページ上で他に行うことはすべてコンピュータモニタを参照してレイアウトされているためです。絶対サイズの問題は、一部のブラウザー（IE）がWebページのピクセル値要素をスケーリングしないため、ズームイン / ズームアウトしようとすると、それらの要素を除いてすべてが調整されることです。

IE8がこれを適切に処理するかどうかはわかりませんが、他のすべてのブラウザーベンダーはピクセルを適切に処理し、ユーザーがテキストを拡大/縮小する必要がある少数派のケースです（このため、このテキストボックスはおそらく例外です）。あなたが本当に汚くなりたいのなら、あなたは常にあなたのテキストサイズを大きくするためのJavaScript関数を追加して、ユーザーに「小さい」/「大きい」ボタンを提供することができます。

Yahooユーザーインターフェイスライブラリ（http://developer.yahoo.com/yui/）には、ブラウザーの特定の設定を「リセット」してサイトを表示するための基礎がすべて（サポートされる）と同じになるように使用される、ベースCSSクラスの素晴らしいセットがあります。ブラウザ。

YUIでは、パーセンテージを使用することになっています。