CSS高度属性height用法详细介绍

2021年4月2日11:21:53 发表评论 1,130 次浏览

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">
             lsbin: A computer science portal
         </div>
     </body>
</html>

输出如下:

CSS_height属性数值

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">
             lsbin: A computer science portal
         </div>
     </body>
</html>

输出:

CSS height属性

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">
             lsbin: A computer science portal
         </div>
     </body>
</html>

输出如下:

CSS height属性自动

继承:用于从其父元素设置height属性。

支持的浏览器:支持的浏览器高度属性下面列出:

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

木子山

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: