在 web 前端开发中，max-height 是一个常用的 CSS 属性，用于设置元素的最大高度。通过设置 max-height，我们可以限制元素的高度，使其不会超过指定的最大高度值。这在设计响应式布局时非常有用，可以确保元素在不同屏幕尺寸下保持良好的显示效果。
语法
max-height 属性的语法非常简单，如下所示：
-------- - ----------- ------ -
其中，selector 表示要应用该属性的元素选择器，value 表示最大高度值。常见的 value 值包括像素（px）、百分比（%）等。
示例
假设我们有一个 div 元素，我们希望其最大高度为 200 像素，可以这样设置：
--- - ----------- ------ -
这样，无论 div 元素的内容有多高，其高度都不会超过 200 像素。如果内容高度超过了 200 像素，元素将会出现滚动条以便用户查看全部内容。
注意事项
- 当元素的实际高度小于
max-height时，元素的高度将会自动调整为实际高度。 - 如果同时设置了
max-height和height属性，max-height会覆盖height属性，即元素的高度不会超过max-height的值。 max-height属性不会影响元素的最小高度，如果需要限制元素的最小高度，应该使用min-height属性。
通过合理地运用 max-height 属性，我们可以更好地控制元素的高度，从而实现更加灵活和美观的布局效果。