汽車在保證金中做了什麼：0 auto？

auto在margin:0 auto;中做了什麼？汽車在保證金中做了什麼：0 auto？

我似乎無法理解auto的功能。我知道它有時會使對象居中。謝謝。

2010-07-03 Jitendra Vyas

115

當您在已應用margin: 0 auto的對象上指定width時，對象將居中放置在其父容器中。

指定auto作爲第二個參數基本上告訴瀏覽器自動確定左邊距和右邊距本身，它通過將它們設置爲相等來自動確定。它確保左右邊距將被設置爲相同的大小。第一個參數0表示頂部和底部邊緣都將被設置爲0。

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

因此，給你一個例如，如果家長100px的和孩子是50像素，那麼auto財產將確定有50像素的可用空間分享margin-left之間margin-right：

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

這將使：

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

看看這個jsFiddle。您不必指定父寬度，只需指定子對象的寬度。

來源

2010-07-03 08:05:27 GenericTypeTea

但是我們從來沒有給'body'定義任何寬度，我們總是給'width'和'margin：0 auto'設置爲'＃wrapper' – 2010-07-03 08:08:07

ok，然後body和object之間的邊距將由瀏覽器自動計算。 – 2010-07-03 08:15:34

'％'中是否有類似的值？我的意思是在CSS中有任何其他屬性，可以給出相同的結果，如左側和右側'auto' – 2010-07-03 08:16:43

auto：瀏覽器設置邊距。這樣做的結果是依賴於瀏覽器的

保證金：0自動指定

* top and bottom margins are 0 
* right and left margins are auto

來源

2010-07-03 08:09:19 shin

從CSS規範上Calculating widths and margins for Block-level, non-replaced elements in normal flow：

如果兩個「緣左」和「保證金右'是'auto'，他們使用的值是相等的。這使元件相對於容納塊的邊緣水平居中。

來源

2010-07-03 08:10:35 Gumbo

「他們使用的價值是相等的」這是什麼意思？ – 2010-07-03 08:12:32

@ metal-gear-solid - 如果父級的寬度（由瀏覽器或指定寬度決定）爲100像素，而您的子級div的寬度爲50像素。然後margin：0 auto將確定有50px的可用空間。然後將它除以2，得到25.然後左右邊距均設爲25，即值設定相等。 – GenericTypeTea 2010-07-03 08:17:02

使用的值是指實際使用的值，取決於使用此屬性及其包含塊的元素的實際視覺屬性。鏈接部分有一個公式，用於計算元素與其包含塊之間的水平差異。然後將這個差異平均分配並用作實際的水平裕量值。例如 – Gumbo 2010-07-03 08:18:18

margin:0 auto;

0是上下和auto的左右。這意味着左右邊距將根據元素的寬度和容器的寬度來設置自動邊距。

一般來說，如果你想把任何元素置於中心位置，那麼margin:auto完美的作品。但它只適用於塊元素。

來源

2014-01-28 18:12:41 user3237573

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

0表示上下，左上表示自動。瀏覽器設置邊距。

來源

2017-08-07 10:24:51

汽車在保證金中做了什麼：0 auto？

回答

相關問題