9

我有简单的 div 标签，绝对位于 HTML 文档中。在 Chrome 中，我将其“右”CSS 规则设置为以像素为单位的固定值，并将其“左”规则设置为“自动”，然后立即使用 jquery 的position()方法确定其左位置，返回的值是这种：122.6363525390625。offset()方法也是如此。

另一方面，Firefox 没有这个问题。

你能告诉我为什么会发生这种情况以及是否有办法防止它发生吗？提前致谢！

4

2 回答 2

10

因为当您使用百分比宽度时，这就是数学的结果。想象一下，你有这样的布局：

<div style="width: 111px">
    <div style="width: 50%"></div>
</div>

内部元素的宽度计算为 55.5 像素，而不是自然数。根据确切的 CSS 属性，这可以很容易地计算出更多的小数位。

Chrome使用亚像素渲染，所以这就是你看到这种行为的原因。

最后：我不知道为什么这会给你带来问题，但当然如果你想四舍五入到一个自然数，你可以使用Math.round(x).

于 2012-06-23T11:58:37.283 回答
-3

在 Chrome 中，值被截断，因此 120、120.5 和 120.6 都显示相同的宽度，因此您无需担心使用十进制值。没有什么比 0.5 像素更好的了。像素是整个单位。如果您确实遇到函数返回十进制值的问题，那么为什么不使用 parseInt 呢？你不应该把这件事留给浏览器来处理，否则你的页面可能会损坏。

于 2012-06-23T10:50:10.190 回答