height:100%和height:inherit比较

height:100%和height:inherit

在我的理解中。

1. height: 100%; 是会继承父元素的100%的高度
2. height: inherit; 是会继承父元素的高度

我觉得他们的意思是一样的，目前来说，我没有找到任何的不同点。

但是，具体的现象却不是的。请看下面的来那个张图片。采用的是flex布局。

这里就很确定的说明了，height: 100%; 和 height: inherit 中存在差异。

CSS属性值分为四种：初始值、计算值、应用值、当前值。height: 100%; 和 height: inherit 都是属于计算值，需要根据父元素的高度进行计算后，才能得到 应用值 -> 当前值.

此时的分析其实已经到了最原理的知识了，后面就是浏览器的渲染机制了。所以我接下来会说明我的猜想：

1. height: 100%; 明显是会继承继承父元素的高度 * 100%，但是父元素.par并没有指定高度，它的高度是有个子元素.content撑开的，所以我的结论是：height: 100% 并没有起到实质性的作用
2. height: inherit; 是指定了子元素继承父元素.par的高度，我猜想的是：子元素会继承父元素的“最终高度” -- 应用值，所以它才能与右边的兄弟元素等高。