CSS属性中`auto`值的含义是什么？

Question

autoCSS属性的值是什么意思.当CSS属性的值设置为auto？时会发生什么？

Answer 1

根据元素的内容或上下文自动调整所述属性的值.

例如,块级元素随着height: auto包含更多文本而变得更高.对于另一个示例,具有margin: 0 auto将具有左边距和右边距的块元素增加,直到其沿着视口的y轴居中.

它实际上取决于您赋予值的属性,不同的属性根据内容和上下文的不同而有所不同.

@MarceloBarbosa:不,即使在接受这两个值的属性中,auto也并不总是意味着100%.例如,100%宽度会强制内联块元素为其容器宽度的100%,即使同一行上还有其他元素(这些元素也会被推到下一行).自动宽度会导致内联块缩小以适合其内容,这当然不是100%. (7认同)

Answer 2

自动意味着自动注入.我使用auto的最常见原因是:

margin: 0 auto;

使一个元素居中.

请注意:如果未声明尺寸,则无法使用.

示例1:div不居中,auto不起作用

<style>
    .cont {
        margin: 0 auto;
    }
</style>
<div class="cont"></div>

示例2:div以页面为中心

<style>
    .cont {
        width: 1000px;
        margin: 0 auto;
    }
</style>
<div class="cont"></div>