getPropertyValue('font-size') 为 firefox 和 chrome 返回不同的值答案

【问题标题】：getPropertyValue('font-size') returns different value for firefox and chromegetPropertyValue('font-size') 为 firefox 和 chrome 返回不同的值
【发布时间】：2015-03-06 00:43:09
【问题描述】：

我正在使用从这里改编而来的以下代码：How To Get Font Size in HTML

代码是：

function checkminfont() {
var el = document.getElementById('fontcheck');
var style = window.getComputedStyle(el, null).getPropertyValue('font-size');
var fontSize = parseFloat(style);
alert(fontSize);
}

ID 为“fontcheck”的元素是一个字体大小设置为 11 的 div。我试图找到一种可靠的方法来确定用户的最小字体大小是否设置为 11 以上。在 Chrome 中，此功能完美运行 - 当最小字体大小在 11 以上，警报会给出最小字体大小的值。在 Firefox 中，无论最小字体大小设置为多少，警报都会显示 11。这是为什么？有没有办法可靠地测试 Firefox 中的最小字体大小？最终，我试图放大某些元素，以便在用户增加字体大小时它们将成比例。

【问题讨论】：

"我正在尝试放大某些元素，以便在用户增加字体大小时它们将成比例。"。然后只需使用em 单位。不需要JS。
我可能能够完成一些我想用 em 做的事情 - 但我希望有更多的灵活性 - 例如我可能想要加载更大的图像而不是仅仅将它们炸毁等。最终，我希望它能够正常工作，这样我就可以测试不同的策略，看看哪些外观和功能最好。

标签： javascript css google-chrome firefox font-size

【解决方案1】：

以下代码也适用于 firefox：

function checkminfont() {
var m = '<div id="min-font-size-tester"';
m += ' style="font-size: 2px; line-height: 1;';
m += ' display: none;">M</div>';
$('body').append(m);
minsize = $('#min-font-size-tester').height();
alert(minsize);
}

感谢 Bobby Jack：http://www.fiveminuteargument.com/minimum-font-scaler

【讨论】：