Skip to main content

元素最大宽度 max-width

Docs

max-width | MDN (mozilla.org)

max-width 属性用来给元素设置最大宽度值。定义了 max-width 的元素会在达到 max-width 值之后避免进一步按照 width 属性设置变大。

max-width 会覆盖width设置，但 min-width设置会覆盖 max-width.

/* <长度> 值 */
max-width: 3.5em;

/* <百分比> 值 */
max-width: 75%;

/* 关键字 */
max-width: none;
max-width: max-content;
max-width: min-content;
max-width: fit-content;
max-width: fill-available;

/* 全局设置 */
max-width: inherit;
max-width: initial;
max-width: unset;

语法​

max-width =
  none                                      |
  <length-percentage [0,∞]>                 |
  min-content                               |
  max-content                               |
  fit-content( <length-percentage [0,∞]> )

<length-percentage> =
  <length>      |
  <percentage>

规范​

CSS Box Sizing Module Level 3 (w3c.github.io)

w3c_max-width_max-height

示例​

Loading Github Gist ...