CSS参考手册
Miscellaneous Level 2
最大高度 | max-height
该max-height
CSS属性设置元素的最大高度。它可以防止height
属性的使用值变得大于指定的值max-height
。
/* <length> value */
max-height: 3.5em;
/* <percentage> value */
max-height: 75%;
/* Keyword values */
max-height: none;
max-height: max-content;
max-height: min-content;
max-height: fit-content;
max-height: fill-available;
/* Global values */
max-height: inherit;
max-height: initial;
max-height: unset;
max-height
覆盖height
,但min-height
覆盖max-height
。
Initial value |
none |
---|---|
应用对象 |
all elements but non-replaced inline elements, table columns, and column groups |
是否可继承 |
no |
百分比值 |
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 none. |
媒体 |
visual |
计算值 |
the percentage as specified or the absolute length or none |
动画类型 |
a length, percentage or calc(); |
规范顺序 |
the unique non-ambiguous order defined by the formal grammar |
语法
值
<length>
最大高度,表示为 <length>
。<percentage>
最大高度,以<percentage>
包含块的高度表示。如果未明确指定包含块的高度,则将百分比值视为零。
关键字值
none
高度没有最大值。
max-content
内在的首选高度。
min-content
内在的最小高度。
fill-available
包含块的高度减去垂直边距,边框和填充。(请注意,某些浏览器这个关键字实现一个古老的名字,available
。)
fit-content
同为max-content.
形式语法
<length> | <percentage> | none | max-content | min-content | fit-content | fill-available
实例
table { max-height: 75%; }
form { max-height: none; }
规范
Specification |
Status |
Comment |
---|---|---|
CSS Intrinsic & Extrinsic Sizing Module Level 3The definition of 'max-height' in that specification. |
Working Draft |
Adds the max-content, min-content, fit-content, and fill-available keywords. (Both CSS3 Box and CSS3 Writing Modes drafts used to define these keywords, but are superseded by this spec.) |
CSS TransitionsThe definition of 'max-height' in that specification. |
Working Draft |
Defines max-height as animatable. |
CSS Level 2 (Revision 1)The definition of 'max-height' in that specification. |
Recommendation |
Initial definition. |
浏览器兼容性
Feature |
Chrome |
Edge |
Firefox (Gecko) |
Internet Explorer |
Opera |
Safari (WebKit) |
---|---|---|---|---|---|---|
Basic support |
1.0 |
(Yes) |
1.0 (1.7 or earlier) |
7.0 |
7.0 |
1.0 |
applies to <table> 1 |
No support |
No support |
(Yes) |
No support |
(Yes) |
No support |
max-content, min-content, and fit-content |
No support 3 |
No support |
3.0 (1.9)-moz 2 |
No support |
No support |
93 |
fill-available |
No support |
No support |
No support bug 527285 |
No support |
No support |
No support |
Feature |
Android |
Edge |
Firefox Mobile (Gecko) |
IE Phone |
Opera Mobile |
Safari Mobile |
---|---|---|---|---|---|---|
Basic support |
? |
(Yes) |
? |
? |
? |
? |
applies to <table> 1 |
? |
No support |
? |
? |
? |
? |
max-content, min-content, and fit-content |
? |
No support |
? |
? |
? |
93 |
fill-available |
? |
No support |
? |
? |
? |
? |
Miscellaneous Level 2相关
层叠样式表( Cascading Style Sheets )是一种用来表现 HTML 或 XML 等文件样式的计算机语言。CSS 不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。