max-height

2019-11-26 16:56:31 浏览数 (1)

用途

max-height 规定标签设置最大高度,且能阻止height属性的设置值比max-height大。

max-height 可覆盖 height , min-height 可覆盖 max-height。

语法

代码语言:javascript复制
/* <length> value */ 
max-height: 2.5em; 

/* <percentage> value */ 
max-height: 95%;

 /* Keyword values */ 
 max-height: none; 
 max-height: max-content; 
 max-height: min-content; 
 max-height: fit-content; 
 max-height: fill-available; 
 max-height: inherit;

描述

<length>

此关键词指定一个固定的最大高度。

<percentage>

此关键词表示相当于包含该元素的块的高度(即相当于该块的百分比)。若块未明确的指定高度,则该百分比相当于none

none

此关键词表示不限制高度。

max-content

此关键词表示内在的最大高度。

min-content

此关键词表示内在的最小高度。

fill-available

此关键词表示包含的块的高度减去水平方向上的 margin 、 border 和 padding。

fit-content

此关键词表示内在的最大高度。

例子

代码语言:javascript复制
/* HTML */
<div id="red"> Hudaokeji. </div>

#red { 
    width: 200px; 
    max-height: 300px; 
    margin: auto; 
    background: red; 
    text-align: center; 
 }

0 人点赞