为什么 chrome 突出显示样式中未列出或计算的边距答案

【问题标题】：Why is chrome highlighting a margin that is not listed in styles or computed为什么 chrome 突出显示样式中未列出或计算的边距
【发布时间】：2016-07-30 09:58:41
【问题描述】：

“样式”下没有显示边距样式，正如您所见，它也没有显示任何正在计算的内容。不知道这里发生了什么，但我在将元素的宽度更改为 90% 后立即注意到了这一点。我正在使用粉底，所以也许它有一些竞争风格？

我不是在问如何解决我的具体问题，这就是我没有发布代码的原因。我只是很困惑为什么 chrome 在没有显示任何要计算的内容时会突出显示边距

【问题讨论】：

您应该发布更多代码。您的图片不足以识别问题。
我并不是真的在问如何解决我的问题，我只是很困惑为什么 chrome 在没有显示任何计算的边距时会显示高亮。这是正常行为吗？
因为它可能不是margin。有没有相对定位？
我要求的代码不一定能解决你的问题。正如我所说，这将有助于确定来源。
我自己没有添加任何内容，但基金会可能会添加一些内容。但是，是的，清理代码只是一件大事，这样它现在就可以像一团糟一样被发布。但是你能详细说明它怎么可能不是利润吗？听起来这可能会回答我的问题。我的假设是，那种颜色的高光总是意味着边距。

标签： css google-chrome google-chrome-devtools

【解决方案1】：

我的猜测是包含small-4 可能有填充？或者 Chrome 正在尝试变得聪明。

【讨论】：

【解决方案2】：

这是由display: block 规则引起的。

该元素占据了其父元素的整个水平空间，因此 Chrome 尝试通过使用边距颜色为占据的空间着色来传达这一点。

将规则更改为 display: inline-block 或 display: inline 以解决问题。

【讨论】：

我的问题是，这导致我的一个元素向左偏移了一点，所以我在它上面拍了一个margin: 0 auto 和 BAM！把那个坏男孩集中起来！

【解决方案3】：

完全明白你在说什么。你要问的是：我在哪里可以看到规则，例如“body { margin: 10px; }”这在某种程度上是 Chrome 中的默认设置。我只知道这一点，因为当我将边距设置为 0 时，我可以看到文本缩进的大幅跳跃。此外，正如您在 Chrome 中提到的那样，理论上不应该存在一个亮点。因此添加了一些默认的“填充”或“边距”。不确定您处于哪个级别，但您可能希望查看这些值的重置来回答您的问题：https://css-tricks.com/reboot-resets-reasoning/

【讨论】：