min-height
CSS 属性 min-height 能够设置元素的最小高度。这样能够防止 heightmin-height 的值。
当 min-height 大于 max-height 或 height 时，元素的高度会设置为 min-height 的值。
语法
/* <长度> 数值 */
min-height: 3.5em;
/* <百分比> 数值 */
min-height: 10%;
/* 关键词 */
min-height: max-content;
min-height: min-content;
min-height: fit-content(20em);
/* 全局数值 */
min-height: inherit;
min-height: initial;
min-height: unset;
Values
<length>- 定义
min-height为一个绝对数值。 <percentage>- 定义
min-height为一个相对于父容器高度的百分数。 auto- 浏览器将通过计算为指定元素选择一个
min-height值。 none- 不限制盒容器的尺寸。
max-content- The intrinsic preferred
min-height. min-content- The intrinsic minimum
min-height. fit-content(<length-percentage>)- Uses the
fit-contentformula with the available space replaced by the specified argument, i.e.min(max-content, max(min-content, argument)).
Formal definition
| 初始值 | auto |
|---|---|
| 适用元素 | all elements but non-replaced inline elements, table columns, and column groups |
| 是否是继承属性 | 否 |
| Percentages | The percentage is calculated with respect to the height of the generated box's containing block. If the height of the containing block is not specified explicitly (i.e., it depends on content height), and this element is not absolutely positioned, the percentage value is treated as 0. |
| 计算值 | the percentage as specified or the absolute length |
| Animation type | a length, percentage or calc(); |
Formal syntax
auto | <length> | <percentage> | min-content | max-content | fit-content | fit-content(<length-percentage>)where
<length-percentage> = <length> | <percentage>
示例
Setting min-height
table { min-height: 75%; }
form { min-height: 0; }
规范
| Specification | Status | Comment |
|---|---|---|
| CSS Box Sizing Module Level 4 min-height |
Editor's Draft | |
| CSS Box Sizing Module Level 3 min-height |
Working Draft | Adds the max-content, min-content, fit-content keywords. |
| CSS Level 2 (Revision 1) min-height |
Recommendation | Initial definition. |
浏览器兼容性
BCD tables only load in the browser