0

如何获得用 CSS 编写的字体大小？它返回错误的值。

jsFiddle 示例

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

4 回答 4

2

在您的示例中，您使用了很多小数位。根据CSS 规范，对小数位所需的精度没有要求。只是小数是可能的。

话虽如此，我认为您可能遇到的小数点不准确是浏览器对它将存储的小数位数的限制。尤其是在像素方面，因为你真的不能显示半个像素。

em如果您正在寻找这种类型的精度，您可能最好使用将缩放到当前继承的字体大小。

于 2013-08-14T15:23:14.307 回答
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/

于 2013-08-14T15:19:16.650 回答
1

如果我理解你的问题，这里的问题是字体大小定义值中的小数。这是正确的方法：

CSS

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

如果您想为任何设备提供更动态的行为，则必须使用“em”来定义值：

CSS

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

这是响应式网页设计，以防您想进一步研究它。

问候，

于 2013-08-14T15:20:53.943 回答
1

根据我的经验，我看到大多数浏览器只能解析到小数点后千位，所以如果你的字体大小在这方面几乎相同，那么浏览器可能只是做了一些四舍五入来给你相同的值。

不过我很好奇，为什么要两个几乎相同且相差小于 1 像素的字体大小声明？听起来您需要重新考虑解决问题的方法，并且更好的方法可能会解决您正在查看的问题。

于 2013-08-14T15:29:45.190 回答