3

font-size プロパティの値をパーセントからピクセルに変換したい

このhtmlコードがあるとしましょう

     <div style="font-size: 180%;">
              <a href="http://www.example.com"> link </a>
     </div>

font-size: 180%; に相当する値を見つける方法 ピクセルで？

ありがとう

4

2 に答える 2

7

パーセント単位のフォント サイズは親ブロックのフォント サイズに比例するため、単純な答えはありません。Firebug でフォント サイズをピクセル単位で手動で調整するのが最も簡単だと思います。

于 2009-09-02T09:37:28.950 に答える
2

これを自動的に行うのは少し難しいかもしれません。フォント サイズのパーセンテージは基本値に対して行われ、その基本値は親ブロックのフォント サイズです。これは、フォント サイズの変更が次のようにネストされていることを意味します。

<div style="font-size: 16px;">
  This text has size 16px.
  <div style="font-size: 150%;">
    This text has size 150% * 16px = 24px.
    <div style="font-size: 150%;">
      Because this div is nested, the base value is now 24px. 
      font-size: 100% would mean 24px type.
      So the size of the text here is 150% * 24px = 36px.
    </div>
  </div>
</div>

そしてそれは、ほぼ確実に簡単な解決策がないことを意味します。

パーセンテージがネストされている場所がないことが確実な場合 (上記の例のように)、すべてのパーセンテージをベース フォント サイズにパーセンテージを掛けたものに置き換えるだけです。

ただし、さまざまなページが多数ある場合は、おそらくそれに頼ることはできません。その場合、HTML/CSS の解析を実行し、すべてのページを調べて、すべての要素のフォント サイズを計算して問題を解決する必要があります。残念ながら、簡単な解決策はありません。

聞きたいのですが、なぜこれを行う必要があるのですか？ページの基本フォント サイズを (body タグで) ピクセル単位で宣言している限り、パーセント フォント サイズと絶対フォント サイズの間に機能上の違いはありません。本文に次のようなフォント宣言がある場合:

body {
  font: 100% font1, font2;
}

次に、次のように置き換えます。

body {
  font: 16px font1, font2;
}

また、非常に特殊な要件がない限り、ページ全体のすべてのフォント サイズ宣言を置き換えるのと同じように機能します。

(16px は、Web ブラウザーのほぼ普遍的な既定のフォント サイズです。)

于 2009-09-02T17:00:26.680 に答える