为什么getComputedStyle不考虑保证金崩溃？

Question

关于浏览器内的Javascript，window.getComputedStyle()方法应该给出应用于元素的CSS属性的最终使用值。根据{{​​3}}，这意味着“在完成所有计算之后”。

然而，似乎“所有计算”都不包括保证金崩溃。在Firefox和Chrome中（至少），指令getComputedStyle().marginBottom会在计算任何边距折叠之前返回计算值。

例如，请考虑以下元素：

<div style="margin: 10px 0 15px 0"></div>

它的顶部和底部边距将被折叠，因为（大致）其内容高度为零（参见MDN documentation）。 CSSOM方法将返回以下值：

getComputedStyle().marginTop → 10px
getComputedStyle().marginBottom → 15px
getBoundingClientRect().top → {top of margin box} + marginTop
getBoundingClientRect().bottom → idem top

但是，由于边缘折叠，布局在边界客户矩形之前显示10px的边距，之后的边距为5px，即max(0, marginBottom - marginTop)。

为什么getComputedStyle().marginBottom没有直接返回5px，“所有计算完成后的实际使用值”，而不是指定的15px？这是W3C推荐的行为吗？ （我在w3.org文档中没有看到任何相关内容。）

这是一个错误还是一个功能？

Answer 1

我没有看到你的所有代码，但我认为函数名实际上是＆＃34; getComputedStyle，＆＃34;用＆＃34; u＆＃34;。

错字？难道这么容易吗？你不会成为第一个 - 包括我自己。

希望这有帮助。