margin: 0 auto 中 auto 的作用是什么？
auto 在 margin: 0 auto; 中做什么？
我似乎无法理解 auto 的作用。我知道它有时具有使对象居中的效果。
What does auto do in margin: 0 auto;?
I can't seem to understand what auto does. I know it sometimes has the effect of centring objects.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（9）
当您在已应用
margin: 0 auto的对象上指定宽度时，该对象将位于其父容器的中央。指定
auto作为第二个参数基本上告诉浏览器自动确定左右边距，这是通过将它们设置为相等来实现的。它保证左边距和右边距设置为相同的大小。第一个参数 0 表示上边距和下边距都将设置为 0。因此，举个例子，如果父级为 100px，子级为 50px，则
auto属性将确定margin-left和margin-right之间有 50px 的可用空间可供共享：这将给出：
看看这个 jsFiddle。您不必指定父对象的宽度，只需指定子对象的宽度。
When you have specified a
widthon the object that you have appliedmargin: 0 autoto, the object will sit centrally within its parent container.Specifying
autoas the second parameter basically tells the browser to automatically determine the left and right margins itself, which it does by setting them equally. It guarantees that the left and right margins will be set to the same size. The first parameter 0 indicates that the top and bottom margins will both be set to 0.Therefore, to give you an example, if the parent is 100px and the child is 50px, then the
autoproperty will determine that there's 50px of free space to share betweenmargin-leftandmargin-right:Which would give:
Have a look at this jsFiddle. You do not have to specify the parent width, only the width of the child object.
auto：浏览器设置边距。其结果取决于浏览器。margin:0 auto指定：auto: The browser sets the margin. The result of this is dependent on the browser.margin:0 autospecifies:来自 CSS 规范 计算块级、非替换元素的宽度和边距正常流程：
From the CSS specification on Calculating widths and margins for Block-level, non-replaced elements in normal flow:
0表示上下，auto表示左右。这意味着左右边距将根据元素的宽度和容器的宽度采取自动边距。一般来说，如果您想将任何元素放在中心位置，那么
margin:auto就可以完美工作。但它只适用于块元素。0is for top-bottom andautofor left-right. It means that left and right margin will take auto margin according to the width of the element and the width of the container.Generally if you want to put any element at center position then
margin:autoworks perfectly. But it only works in block elements.通过对这两个值如何工作的一些解释，它会变得更加清晰。
margin 属性是以下内容的简写：
那么为什么只有两个值呢？
好吧，你可以用这样的四个值来表达边距：
这意味着顶部 10 像素，右边 20 像素，底部 15 像素，左边 5 像素
同样，你也可以用这样的两个值来表达：
这会给你一个顶部和底部 20 像素以及左边 10 像素的边距对了。
如果你设置：
那么这意味着顶部和底部边距为 20px，左右边距为 auto。 auto 表示左/右边距根据容器自动设置。如果您的元素是块类型元素，这意味着它是一个框并占据视图的整个宽度，则 auto 将左右边距设置为相同，因此元素居中。
It becomes clearer with some explanation of how the two values work.
The margin property is shorthand for:
So how come only two values?
Well, you can express margin with four values like this:
which would mean 10px top, 20px right, 15px bottom, 5px left
Likewise you can also express with two values like this:
This would give you a margin 20px top and bottom and 10px left and right.
And if you set:
Then that means top and bottom margin of 20px and left and right margin of auto. And auto means that the left/right margin are automatically set based on the container. If your element is a block type element, meaning it is a box and takes up the entire width of the view, then auto sets the left and right margin the same and hence the element is centered.
中的
auto告诉浏览器自动设置元素的
margin-left和margin-right属性，浏览器通过提供两个边距来完成此操作相同的值。需要注意的一些重要事项是：
它只能用于具有指定宽度的块级元素：
a.如果未指定宽度，则左右边距将设置为 0，因为块级元素占据容器的整个宽度。
b.对于
inline或inline-block元素，没有可用于设置边距的水平空间，因为前后存在其他内联元素。auto仅对于水平居中有用，因此使用margin: auto 0;将不居中垂直的一个元素。 来源The
autointells the browser to set the
margin-leftandmargin-rightproperties of the element automatically which the browser accomplishes by giving both margins the same value.Some important things to note are:
It can only be used for block-level elements having specified width:
a. If the width is not specified, the left and right margins would be set to 0 as block-level elements take up the entire
widthof the container.b. For
inlineorinline-blockelements, there is no horizontal space available to set the margin as there are other inline elements present before and after.autois useful only for horizontal centering, so usingmargin: auto 0;will NOT center an element vertically. source0 表示上下，auto 表示左右。
浏览器设置边距。
0 is for top-bottom and auto for left-right.
The browser sets the margin.
它是一个 CSS 属性，将元素的顶部和底部边距设置为 0 并将其在其父元素内水平居中。
此技术通常用于将块级元素（例如 div 或图像）居中。
It is a CSS property that sets the top and bottom margins of an element to 0 and centers it horizontally within its parent element.
This technique is often used to center a block-level element such as a div or a image.
它是“中心”标签的损坏/非常难以使用的替代品。当您需要破碎的表格以及块和文本无法居中时，它会派上用场。
It is a broken/very hard to use replacement for the "center" tag. It comes in handy when you need broken tables and non-working centering for blocks and text.