CSS 属性

min-height 属性用于设置元素高度的下限。

属性值

  • length − 任何长度单位。该元素的高度值永远不能低于该值。默认值为 0。

  • percentage: 它以包含块的高度百分比设置元素的最小高度。

  • initial: 将 min-height 的值设置为默认值。

  • inherit: min-height 的值继承自其父值。

适用范围

除不可替换的内联元素和表格元素之外的所有 HTML 元素。

DOM 语法

object.style.minHeight = "50px"

CSS min-height 示例

以下示例演示如何使用 min-height 属性设置元素的最小高度 -

<html>
   <head>
      <style>
            div.a {
                   border: 2px solid red;
                   min-height: 200px;
                   width: 80%;
                   overflow: auto;
                   margin-bottom:5px;
                  }
            div.b {
                   border: 2px solid blue;
                   min-height: 40%;
                   overflow: auto;
                   margin-bottom:5px;
                  }
            div.c {
                   border: 2px solid green;
                   min-height: 20px;
                   overflow: auto;
                   margin-bottom:5px;
                  }
      </style>
   </head>
   <body>  <div style="border:2px dashed black; margin-bottom:4px;">
             <h2>最小高度：0（默认）：</h2>
             <p>CSS中的<i>min-height</i>属性用于设置元素的最小高度。 它指定元素可以具有的最小高度，确保它永远不会收缩到该值以下。</p>
       </div>
       <div class="a">
             <h2>最小高度：200px，宽度：80%</h2>
             <p>CSS中的<i>min-height</i>属性用于设置元素的最小高度。 它指定元素可以具有的最小高度，确保它永远不会收缩到该值以下。</p>
       </div>
       <div class="b">
             <h2>最小高度：40%</h2>
             <p>CSS中的<i>min-height</i>属性用于设置元素的最小高度。 它指定元素可以具有的最小高度，确保它永远不会收缩到该值以下。</p>
       </div>
       <div class="c">
             <h2>最小高度：20px（小于内容）</h2>
             <p>min-height 小于内容，因此属性 <i>min-height</i> 无效。
                CSS 中的 <i>min-height</i> 属性用于设置元素的最小高度。
                它指定元素可以具有的最小高度，确保它永远不会缩小到低于该值。
             </p>
       </div>
   </body>
</html>