[解決済み] CSSです。フォントサイズ100％ - 100％って何？

質問

があります。 多数 記事 そして 質問 について パーセントサイズとその他のサイズ フォントを使用します。しかし、パーセント値の基準が何であるかがわかりません。これは「すべてのブラウザで同じサイズ」であると理解しています。また、例えばこんなことも書いてありました。

パーセント(%)。パーセント単位は「em」単位とよく似ているが、いくつかの基本的な違いがある。まず第一に、現在のフォント・サイズが100%に等しいことです（例：12pt = 100%）。パーセント単位を使用しても、モバイル機器やアクセシビリティのためにテキストを完全にスケーラブルに保つことができます。

出典 http://kyleschaeffer.com/best-practices/css-font-size-em-vs-px-vs-pt-vs/

しかし、もしあなたが "ie 12 pt = 100%" と言うなら、それはあなたが最初に font-size: 12pt . そういうものなのでしょうか？最初に絶対的な尺度でサイズを定義して、それを「100%」と表記するのですか？多くのサンプルが置くと便利だと言っているように、あまり意味がありません。

body {
  font-size: 100%;
}

つまり、こうすることで どのような は、フォントサイズとの相対的な関係なのでしょうか？私の画面では、フォントごとに見える大きさが違うことに気づきました。例えば、ArialはTimes New Romanよりずっと大きく見える。また、ボディサイズ＝100％であれば、次のようになります。 その というのは、どのブラウザでも同じになるのでしょうか？それとも、最初に絶対値を定義した場合のみですか？

7月23日(土)更新

少しずつですが、ご容赦ください。

つまり、私が正しく理解していれば、%値はブラウザのデフォルトのフォントサイズに関連しているのです。さて、それはいいのですが、また別の疑問が湧いてきました。

1. この標準サイズは、どのブラウザのバージョンでも常に同じなのでしょうか、それともバージョンによって異なるのでしょうか？
2. Google Chromeの設定を見つけました！（下の画像参照）標準のquot;serif", "sans-serif", "monospace"が表示されていますね。しかし、他のフォントについてはどのように解釈すればよいのでしょうか？例えば、次のように定義します。 font: 100% Georgia; ブラウザはどのような大きさで表示するのでしょうか？それとも、"Georgia"フォントは、ブラウザの標準サイズなのでしょうか？
3. いくつかのWebサイトで 読む のようなものがあります。 Sizing text and line-height in ems, with a percentage specified on the body [..], was shown to provide **accurate, resizable text across all browsers** in common use today . しかし、私が今学んでいることから、実際には、サイズ変更可能なテキスト（この引用で推奨されているように、%またはemを使用）か、「ブラウザ間で正確で一貫したフォントサイズ」を持つ（ベースとしてpxまたはptを使用）かのどちらかを選択すべきであると思います。これは正しいのでしょうか？

Googleの設定です。

このように私は 考える もの かもしれない は、サイズを絶対値で定義しない場合、次のようになります。

解決方法は？

Firefoxのオプションからコンテンツタブをクリックし、フォントサイズを確認することで確認できます。他のブラウザでも同じように確認できます。

私は個人的に自分のウェブサイトのデフォルトのフォントサイズをコントロールしたいので、すべてのページに含まれるCSSファイルで、BODYのデフォルトをこのように設定することにしています。

body {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 14px
}

これで、すべてのHTMLタグのfont-sizeが14pxに継承されるようになりました。

例えば、すべてのdivのフォントサイズをbodyより10%大きくしたい場合、単純にこうします。

div {
    font-size: 110%
}

これで、私のページを見たブラウザは、すべてのdivを自動的にbodyの大きさより10%大きくします。

すべてのdivのfont-sizeを10%小さくしたい場合は、そうします。

div {
    font-size: 90%
}

これにより、すべてのdivのfont-sizeが12.6pxになります。

また、font-sizeは継承されるので、ネストしたdivはそれぞれ10%ずつフォントサイズが小さくなることも知っておく必要があります。

<div>Outer DIV.
    <div>Inner DIV</div>
</div>

内側のdivのfont-sizeが11.34px（12.6pxの90%）となり、意図していない可能性があります。

説明に役立てることができます。 http://www.w3.org/TR/2011/REC-CSS2-20110607/syndata.html#value-def-percentage