CSS3 最小内容尺寸(min-content size)和最大内容尺寸(max-content size)简介

CSS sizing level3规范中，和布局尺寸相关内容，经常会出现min-content size和max-content size等术语。

这需要分为两类：一类是和块元素相关，一类是和行内元素相关。

1. min-content inline size

最小内容行内尺寸表示在尽可能使用软性（即非硬性指定）包含技术（比如自动换行）后，刚好包含了元素内容而不出现溢出的尺寸。

2. max-content inline size

和min-content inline size不同，最大内容行内尺寸表示在不使用任何软性包含技术时，在单行内（除非使用硬性换行）刚好包含了元素内容而不出现溢出的尺寸。

3. max-content block size 和 min-content block size

对于块元素而言，这两者是等同的。

4. max-content contribution 和 min-content contribution

最大内容贡献和最小内容贡献分别对应于max-content, min-content size，

只不过在此之上，还需要计算入内外边距（margin/padding）以及边界（border）的尺寸。

理解这些术语，对于掌握CSS3新引入的网格布局，弹性布局技术都是有帮助的。

自己试一试 有一个直观的印象。

by iefreer