当前位置: 首页>>代码示例 >>用法及示例精选 >>正文


CSS height属性用法及代码示例


height属性用于设置元素的高度。 height属性不包含元素的边距,边距和边框。

用法:

height:auto|length|initial|inherit;

属性值:

  • auto:用于将height属性设置为其默认值。如果height属性设置为auto,则浏览器将计算元素的高度。

    用法:



    height:auto;

    例:

    <!DOCTYPE html> 
    <html> 
        <head> 
            <title> 
                CSS height Property 
            </title> 
              
            <style> 
                .Geeks { 
                    height:auto; 
                    color:white; 
                    font-size:30px; 
                    background-color:green; 
                } 
            </style> 
        </head> 
          
        <body> 
            <h2>CSS height Property</h2> 
              
            <div class = "Geeks"> 
                GeeksforGeeks:A computer science portal 
            </div> 
        </body> 
    </html>                    

    输出:
    CSS_height property numeric value

  • length:用于以px,cm等形式设置元素的高度。长度不能为负数。

    用法:

    height:length;

    例:

    <!DOCTYPE html> 
    <html> 
        <head> 
            <title> 
                CSS height Property 
            </title> 
              
            <style> 
                .Geeks { 
                    height:100px; 
                    color:white; 
                    font-size:30px; 
                    background-color:green; 
                } 
            </style> 
        </head> 
          
        <body> 
            <h2>CSS height Property</h2> 
              
            <div class = "Geeks"> 
                GeeksforGeeks:A computer science portal 
            </div> 
        </body> 
    </html>                    

    输出:
    CSS height property

  • initial:用于将height属性设置为其默认值。

    用法:

    height:initial;

    例:

    <!DOCTYPE html> 
    <html> 
        <head> 
            <title> 
                CSS height Property 
            </title> 
              
            <style> 
                .Geeks { 
                    height:initial; 
                    color:white; 
                    font-size:30px; 
                    background-color:green; 
                } 
            </style> 
        </head> 
          
        <body> 
            <h2>CSS height Property</h2> 
              
            <div class = "Geeks"> 
                GeeksforGeeks:A computer science portal 
            </div> 
        </body> 
    </html>                    

    输出:
    CSS height property auto

  • inherit:它用于从其父元素设置height属性。

支持的浏览器:height属性支持的浏览器如下:

  • 谷歌浏览器1.0
  • Internet Explorer 4.0
  • Firefox 1.0
  • Safari 1.0
  • Opera 7.0



相关用法


注:本文由纯净天空筛选整理自roshalmoraes大神的英文原创作品 CSS | height Property。非经特殊声明,原始代码版权归原作者所有,本译文未经允许或授权,请勿转载或复制。