この例を参照して
ください http://jsfiddle.net/uzgJX/
その結果、テキストを含むボックスの高さ (マウスでテキストを選択すると表示される高さ) になり、テキストの実際の高さよりも高くなります。
jqueryまたはplain jsで実際の高さを取得する方法はありますか?
私が試した例では
text.height()
と
text[0].getBoundingClientRect().height
運が悪いと、14px ではなく 19px と表示されます
代わりに、テキスト要素の計算結果を取得font-sizeします。
parseInt(window.getComputedStyle(text[0]).fontSize, 10);
font-sizeフォントの em 正方形のサイズを表します。ほとんどのグリフは em 正方形の境界内にとどまりますが、一部のグリフはそれらの境界を超える可能性があることに注意してください。ただし、これは通常、垂直ディメンションでは発生しません。
試してみてください: http://jsfiddle.net/uzgJX/1/。ヒント: スクリーンショットを撮り、お気に入りの画像エディターにコピーしてから、テキストの高さに正確に一致するピクセルを選択し、フィドルで指定された値と比較します。