Intrinsic and extrinsic sizing： 固有尺寸与外部尺寸
首先，在解释 max-content 与 min-content 的区别之前，让我们了解一下固有尺寸与外部尺寸的概念。
现在我们有个 div，给他设置宽高分别为 200px，并加上 border，方便我们看得更加清晰。
<div class="s_1">
nemo suscipitarchitectodeserunt vero, eveniet soluta deleniti alias dolor
illum praesentium ipsa minus
</div>
-
当通过 CSS 给元素设置 200px 的宽高时，我们将其称之为「外部尺寸」。
-
当元素的内容决定了元素的尺寸时，我们将其称之为「固有尺寸」。
像上边的图中所示，当我们给一个块元素（block element）设置了固定的外部尺寸时，有可能会出现内容溢出的情况。
在这种场景下，我们可以通过 min-content 这类关键字，利用元素的固有尺寸进行布局。
min-content
min-content 是一个 box 能确保不产生内容溢出的最小尺寸。
示例：
在下图中，会以最长的单词为基准定义 box 的尺寸。
max-content
max-content 是当布局的空间无限制时，box 的理想尺寸。
fit-content
根据实际情况使用max-content或min-content或当前可用空间的尺寸作为宽度值。
具体的：
- 当布局的空间无限制时，使用
max-content； - 当空间较小时，使用当前可利用的宽度作为值，直到缩小到
min-content为止。
