css3对于元素宽高的设置添加了更多的属性,使得更加灵活
以width为例,可以指定为:
- 以下关键词之一:min-content, max-content, fit-content, auto
- 一个长度值<length>或者百分比值<percentage>
其中min-content max-content和fit-content为css3新增的属性,引用MDN对这三个属性的说明:
max-content
: 元素内容固有的(intrinsic)合适宽度。
min-content
: 元素内容固有的最小宽度
fit-content
: min(max-content, max(min-content, <length-percentage>))
如下例子
<div style="width: 200px">
<p style="width: fit-content;">fit-contentfit-contentfit-contentfit-contentfit-contentfit-content</p>
<p style="width: max-content;">max-contentmax-contentmax-contentmax-contentmax-contentmax-content</p>
<p style="width: min-content;">min-contentmin-contentmin-contentmin-contentmin-contentmi