检查浏览器上的框是什么

What is the box on inspect browser

在inspect中检查元素时,这个紫色框代表什么,因为它不是padding,margin或Border,占据了div

里面的space

[1]: https://i.stack.imgur.com/14nnb.png

您可以将其视为属于以下元素的 space:

  • 边距
  • 保证金
  • 边框
  • children

我可能遗漏了一些,但只是 space 未使用,必须以某种方式加以说明。当您进行的布局不是调整大小、填充和边距的结果时,它就会出现。因此,例如,如果您使用 flexbox 或 cssgrid 的间距功能,那么您将看到这些紫色 spaces.