当我有一个高度不均匀(例如 201 px)的容器元素(使用网格或 Flex 布局)并将其他两个元素放入该等分元素内时，Chrome 开发人员工具会显示这些元素的每个高度恰好是一半大小(100.5 像素)。但是，当我使用 JavaScript 获取这些元素的 clientWidth 时，它们会四舍五入为 100px。 101 像素。
当我现在再次将一些其他元素放入这些元素中(宽度和高度设置为 100%)时，它们都显示为 101px。这是布局引擎中的错误吗？ (参见 JSFiddle example 的控制台)。有没有简单的方法可以解决这个问题？
附加说明 我更想知道为什么当外部元素报告 100 时，内部元素确实报告 101px。 101 像素。
最佳答案
根据W3C spec , clientHeight (及相关属性)应该是 long 类型(整数)，因此 JS 引擎返回一个四舍五入的整数值。不过，布局信息仍然可用，如果您想要精确的像素，您应该使用 getBoundingClientRect() 方法。 The MDN如果您需要小数值，还建议使用它。
我已经更新了您的fiddle现在显示半像素:
Outer rects:
200.5
200.5
Inner rects:
200.5
200.5
关于javascript - 浏览器中的半像素如何与 JavaScript clientWidth/clientHeight 关联？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48304023/