自动在边距：0自动中做什么？ [英] What does auto do in margin: 0 auto?

问题描述

auto在margin: 0 auto;中做了什么？

我似乎无法理解auto的作用。我知道它有时有使物体居中的效果。

推荐答案

在已应用margin: 0 auto的对象上指定width后，该对象将位于其父容器的中央。

将auto指定为第二个参数基本上是告诉浏览器自动确定左右边距，这是通过相等地设置它们来实现的。它保证左右边距将设置为相同的大小。第一个参数0表示上边距和下边距都将设置为0。

margin-top: 0;
margin-bottom: 0;
margin-left: auto;
margin-right: auto;

因此，举个示例，如果父对象是100px，子对象是50px，则auto属性将确定在margin-left和margin-right之间有50px的可用空间可供共享：

var freeSpace = 100 - 50;
var equalShare = freeSpace / 2;

这将提供：

margin-left: 25;
margin-right: 25;

看看这个jsFiddle。您不必指定父宽度，只需指定子对象的宽度。

这篇关于自动在边距：0自动中做什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！