如何获得用CSS编写的font-size?

时间:2013-08-14 15:13:31

标签: jquery css font-size

如何获取用CSS编写的字体大小?它返回了错误的值。

jsFiddle example

HTML

<div id="test">TEXT</div>
<div id="test2">TEXT2</div>

CSS

#test{
    font-size: 38.5648887px;
}
#test2{
    font-size: 38.564px;
}

的jQuery

var a = $("#test").css('font-size');
var b = $("#test2").css('font-size');
alert("test  = " + a + "\ntest2 = " + b); // test = 38.5667, test2 = 38.5667

4 个答案:

答案 0 :(得分:2)

在您的示例中,您使用了大量小数位。根据{{​​3}},不需要小数位所需的精度。只是小数是可能的。

话虽这么说,我认为你可能遇到的十进制误差是浏览器对它将存储的小数位数的限制。特别是在像素方面,因为你真的无法显示半个像素。

如果您正在寻找那种类型的精度,那么使用em可能会更好一些,它将扩展到当前继承的字体大小。

答案 1 :(得分:1)

你有什么应该工作,但是,你真的不需要任何jquery。字体大小都可以使用纯css完成。

例如:

#test {
  font: 38px Arial, Helvetica, sans-serif;
  font-weight: bold;
  text-transform: uppercase;
}

#test2 {
  font: 24px Arial, Helvetica, sans-serif;
  font-weight: bold;
  font-variant: small-caps;
}

HTML:

<div id="test">text</div>
<div id="test2">Text</div>

这会回答你的问题吗?

编辑: 看看这个小提琴:http://jsfiddle.net/e8WDk/2/

答案 2 :(得分:1)

如果我理解你的问题,这里的问题是font-size定义值的小数。 这是正确的方法:

CSS

#test{
    font-size: 38px;
}
#test2{
    font-size: 38px;
}

如果您希望任何设备具有更动态的行为,则必须使用“em”来定义值:

CSS

#test{
    font-size: 16em;
}
#test2{
    font-size: 15.5em;
}

这是响应式网页设计,以防您想要更多地了解它。

此致

答案 3 :(得分:1)

根据我的经验,我发现大多数浏览器只解析到小数点后千位,所以如果你的字体大小几乎相同,那么浏览器可能只是做了一些舍入来给你相同的值。 / p>

我很好奇,为什么你想要两个字体大小声明几乎完全相同并且差异小于1个像素?听起来你需要重新考虑解决问题的方法,更好的方法可以解决你正在考虑的问题。