保证金自动是啥意思？

Posted 2023-03-06

【中文标题】保证金自动是啥意思？

【英文标题】：What does margin auto mean?保证金自动是什么意思？

【发布时间】：2014-12-01 13:51:36

【问题描述】：

我检查了MDN 以了解为 margin 属性设置 auto 值是什么意思，它说：“auto 被 替换为某个合适的值，例如它可以用于块的居中。 "

但是那个合适的值是什么，适合什么？

我自己做了一些实验，发现如果添加 ma​​rgin-left: auto，容器会向右移动（就像是向右浮动）：

#container 
    background: red;
    width: 120px;
    margin-left: auto;

http://jsfiddle.net/sph2j6jx/

这是否意味着添加自动边距实际上类似于“占用所有可用空间”？当您同时添加左右边距时，它会使 div 居中，因为它试图从左侧和右侧占据所有空间？

【问题讨论】：

定义margin-right:auto;就像这样jsfiddle.net/sph2j6jx/1

你的结论是正确的。

【参考方案1】：

自动边距

根据情况，提供自动值指示 浏览器根据其提供的值呈现边距 自己的样式表。但是，当这样的边距应用于元素时 具有有意义的宽度，自动边距会导致所有 可用空间呈现为空白。

来自w3.org

【讨论】：

"根据具体情况，提供自动值指示浏览器根据其自己的样式表中提供的值呈现边距。"嗯，对我来说听起来不太可能。作者想到的情况会很有趣。

有意义的宽度是什么意思？

@Gwater17 通过有意义的宽度，这通常意味着显式宽度。我同意文档可能会更好

【参考方案2】：

#main 
  width: 600px;
  margin: 0 auto; 

<div id="main"> 设置块级元素的宽度将防止它向左和向右拉伸到其容器的边缘。然后，您可以将左右边距设置为 auto 以使该元素在其容器中水平居中。元素会占据你指定的宽度，然后剩余的空间会在两个边距之间平分。</div>