0

私はこの記事 を読んでいて、「継承は計算値を使用する」の章で次のように述べています。

これは、長さを使用するフォント サイズなどの継承された値にとって重要です。計算値は、Web ページ上の他の値に関連する値です。

BODY 要素に 1em の font-size を設定すると、ページ全体のサイズが 1em だけになるわけではありません。これは、見出し (H1 ～ H6) などの要素やその他の要素 (一部のブラウザーではテーブル プロパティの計算方法が異なります) は、Web ブラウザーでは相対的なサイズになるためです。他のフォント サイズ情報がない場合、Web ブラウザは常に H1 の見出しをページの最大のテキストにし、その後に H2 というように続きます。BODY 要素を特定のフォント サイズに設定すると、それが「平均」フォント サイズとして使用され、見出し要素はそれから計算されます。

したがって、ブラウザでテキスト サイズを通常に設定した場合、1em は 16px とほぼ同じになります。ブラウザでより大きなテキスト サイズを設定することを選択したことがわかっている場合、テキストはより大きくなります。

それで、彼らは記事で何を言おうとしているのだろうか？

4

2 に答える 2

1

つまり、font-size要素に設定すると、実際の値は親要素に設定された値に関連します。

例：デモ

<div id="test1">
    <h1>First header</h1>
</div>
<div id="test2">
    <h1>Second header</h1>
</div>

h1 { font-size: 1.5em; }

#test1 { font-size: 1em; }
#test2 { font-size: 2em; }

font-size: 1.5emonh1要素はその親に対して相対的に計算され、2 番目の見出しが大きくなります。

于 2013-08-22T11:34:55.137 に答える
0

基本的にはすべて相対的だと言っているので、他のタグのこの値からすべてが計算されることを特に指定しない限り、ボディが 16px であるとしましょう。

em を使用する場合、1em は最上位要素の 16px になります。

例：

<div class="monkeyAss">Hello
<h1>monkeyAss2</h1></div>

.monkeyAss {font-size: 0.5em;}
.monkeyAss h1 {font-size: 1em}

ここで、monkeyAss は 1em で期待どおり 8px になりますが、h1 は別の親 div 内にあるため、相対親から値を取得して 8px になります。それが役立つことを願っています。

于 2013-08-22T11:18:07.147 に答える