Html 保证金底线是如何自动计算的？

我注意到我的

#thing

div下面有很多空白。我的

#thing

margin设置为

margin:100px auto，所以我把它改为
边距：100px自动0px自动，空的空间消失了。为什么
margin-bottom
设置为
auto
会产生一堆空白？它不仅仅是试图填充可见屏幕，因为我的div超出了屏幕的高度；我必须向下滚动才能看到空的空间。
对于块级元素，有一定量的隐式
填充
和
边距
，包括
html
和
body
。如果您曾经遇到过
reset.css
，那么您知道您不是唯一一个感到沮丧的人

使用右侧栏中Chrome Developer Tools的“Box Model”工具查看这些可视化的图形（右键单击元素“Inspect element”、“Computed”）。
为块级元素提供了一定数量的隐式
填充
和
边距
，包括
html
和
正文
。如果您曾经遇到过
reset.css
，那么您知道您不是唯一一个感到沮丧的人

使用右侧栏中Chrome Developer Tools的“Box Model”工具查看可视化的图形（右键单击元素“检查元素”、“计算”）。
简写
边距：100px自动扩展到
边距：100px自动100px自动这意味着：

margin-top: 100px;
margin-right: auto;
margin-bottom: 100px;
margin-left: auto;

所以你没有看到额外的空间，因为
marginbottom:auto。事实上，值
auto
在指定给
页边距顶部
或
页边距底部
时没有意义

编辑：请参阅@web tiki下面关于
auto
与
页边距顶部和
页边距底部的用例的评论

作为参考，
margin
的速记选项包括：

margin: [top] [right] [bottom] [left];
margin: [top] [right/left] [bottom];
margin: [top/bottom] [left/right];

速记
页边距：100px自动扩展到
边距：100px自动100px自动这意味着：

margin-top: 100px;
margin-right: auto;
margin-bottom: 100px;
margin-left: auto;

所以你没有看到额外的空间，因为
marginbottom:auto。事实上，值
auto
在指定给
页边距顶部
或
页边距底部
时没有意义

编辑：请参阅@web tiki下面关于
auto
与
页边距顶部和
页边距底部的用例的评论

作为参考，
margin
的速记选项包括：

margin: [top] [right] [bottom] [left];
margin: [top] [right/left] [bottom];
margin: [top/bottom] [left/right];

100px自动
mean margin top and bottom设置为100px，left/right设置为auto@anpsmn哦，这就解释了<代码>100px自动
平均页边距顶部和底部设置为100px，左/右设置为auto@anpsmn哦，这就解释了<代码>自动
在分配给上下页边距时具有“意义”。它对或非常有用。@web-tiki：只有当元素完全定位并且是时，它才有用。不过，这是一个很好的技巧！我已更新了我的答案，以指向您的评论。
auto
在分配到上下页边距时具有“含义”。它对或非常有用。@web-tiki：只有当元素完全定位并且是时，它才有用。不过，这是一个很好的技巧！我已经更新了我的答案，指向你的评论。