以上代码中，最终的height高度是多少？ 答案：
500px
首先来看一下max-height，MDN的解释为：CSS属性 max-height 设置元素的最大高度。它防止height属性的使用值（used value） 大于 max-height 的指定值。也就是说，当只有height和max-height两种属性时（这里的“只”是没有min-height）height大于max-height，height就会失效，高度变为了max-height，当heght小于等于max-heght时，则使用height，在这里max-height就是起到了一个限制height最大值的作用。 其次来看一下min-height，MDN的解释为CSS 属性 min-height 能够设置元素的最小高度。这样能够防止 height 属性的应用值小于 min-height 的值。可以得出，min-height的作用和max-height是相似的，只不过min-height是限制最小值。 如果三者同时出现呢，将会是什么结果？无外乎这么几种情况：
height > max-height > min-height 元素高度：max-heightheight > min-height > max-height 元素高度：min-heightmin-height > height > max-height 元素高度：min-heightmin-height > max-height > height 元素高度：min-heightmax-height > min-height > height 元素高度：min-heightmax-height > height > min-height 元素高度：height 可以由此得出结论，只要是min-height“篡位”的结果，那么结果都将遵循min-height，剩下的情况则要根据max-height是否被打破来判断。