自动 | auto (Basic Box Model) - CSS 中文开发手册
width 属性指定了元素内容区的宽度。默认情况下，该属性定义了内容区域的宽度。如果box-sizing设置为border-box，则确定边框区域的宽度。
/* <length> values */ 300px; 25em; /* <percentage> value */ 75%; /* Keyword values */ 25em border-box; 75% content-box; max-content; min-content; available; fit-content; auto; /* Global values */ inherit; initial; unset;
在min-width和max-width属性覆盖width。
| 初始值 | auto |
|---|---|
| 适用元素 | all elements but non-replaced inline elements, table rows, and row groups |
| 是否是继承属性 | no |
| Percentages | refer to the width of the containing block |
| 适用媒体 | visual |
| 计算值 | a percentage or auto or the absolute length |
| Animation type | a length, percentage or calc(); |
| 正规顺序 | the length or percentage before the keyword, if both are present |
语法
width属性被指定为：
以下关键字值之一：available，min-content，max-content，fit-content，auto。<length>或<percentage>。这可以选择跟随以下关键字之一：border-box，content-box。
值
<length>可能的长度单位见<length>.
<percentage>指定为包含块宽度的<percentage>.
border-box如出现, 之前的<length>或<percentage>应用到元素的边框盒子.
content-box如出现, 之前的<length>或<percentage>应用到元素的内容盒子.
auto浏览器将会为指定的元素计算并选择一个宽度.
fill使用 fill-available 行内尺寸或者 fill-available 块级尺寸其中一种来作为合适的书写模式。max-content固有的首选宽度.
min-content固有的最小宽度.
available包含块的宽度减去水平 margin, border 和 padding.
fit-content以下两种情况下的较大值:
固有的最小宽度
固有首选宽度（max-content）和可用宽度（available）的较小值
正式语法
[ <length> | <percentage> ] && [ border-box | content-box ]? | available | min-content | max-content | fit-content | auto
示例
默认宽度
p.goldie {
background: gold;
} <p class="goldie">The Mozilla community produces a lot of great software.</p>