CSS height 与 max-height min-height

[height]

解释： 属性设置元素的高度。

支持： 所有主流浏览器都支持 max-height 属性。

说明： 这个属性定义元素内容区的高度，在内容区外面可以增加内边距、边框和外边距。

注释： 行内非替换元素会忽略这个属性。

[max-height]

解释： 属性设置元素的最大高度。

支持： 所有主流浏览器都支持 max-height 属性。

说明： 元素可以比指定值矮，但不能比其高。不允许指定负值。

注释：max-height 属性不包括外边距、边框和内边距

[max-height]

解释： 属性设置元素的最小高度。

支持： 所有主流浏览器都支持 max-height 属性。

说明： 素可以比指定值高，但不能比其矮。不允许指定负值。

【example】

#box {
    width: 100px;
    height: 100px;
    border: 1px solid red;
}
#test {
    width: 100%;
    max-height: 100%;
    background-color: blue;
    /* height: 100%; */
}

#box {
    width: 100px;
    height: 100px;
    border: 1px solid red;
}
#test {
    width: 100%;
    max-height: 100%;
    background-color: blue;
    height: 100%;
}