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


CSS border-top-width用法及代码示例

CSS中的border-top-width属性用于将特定宽度设置为元素的顶部边框。在使用border-top-width属性之前,将border-top-style属性或border-style属性用作元素。

用法:

border-top-width:length|thin|medium|thick|initial|inherit;

属性值:下面列出了border-top-width属性值:


  • length:用于设置边框的宽度。它不取负值。
  • thin:用于在元素顶部设置细边框。
  • medium:用于设置中等大小的顶部边框。它是默认值。
  • thick:用于设置粗大的顶部边框。
  • initial:用于将border-top-width设置为其默认值。
  • inherit:此属性是从其父级继承的。

例:

<!DOCTYPE html>  
<html>  
    <head>  
        <title>  
            border-top-width property  
        </title>  
          
        <style>  
            #thin {  
                border-color:green;  
                border-top-style:solid;  
                border-top-width:thin;  
            }  
            #medium {  
                border-color:green;  
                border-top-style:solid;  
                border-top-width:medium;  
            }  
            #thick {  
                border-color:green;  
                border-top-style:solid;  
                border-top-width:thick;  
            }  
            #length {  
                border-color:green;  
                border-top-style:solid;  
                border-top-width:20px;  
            }  
            #initial {  
                border-color:green;  
                border-top-style:solid;  
                border-top-width:initial;  
            }  
        </style>  
    </head>  
      
    <body style = "text-align:center">  
      
        <h1 style = "color:green">GeeksforGeeks</h1>  
      
        <h3>border-top-width property</h3>  
          
        <div id="thin">  
            border-top-width:thin;  
        </div><br><br>  
          
        <div id="medium">  
            border-top-width:medium;  
        </div><br><br>  
          
        <div id="thick">  
            border-top-width:thick;  
        </div><br><br>  
          
        <div id="length">  
            border-top-width:length;  
        </div><br><br>  
          
        <div id="initial">  
            border-top-width:initial;  
        </div>  
    </body>  
</html>                                 

输出:

浏览器支持:下面列出了border-top-width属性支持的浏览器:

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


相关用法

注:本文由纯净天空筛选整理自sheyakhare1999大神的英文原创作品 CSS | border-top-width Property。非经特殊声明,原始代码版权归原作者所有,本译文的传播和使用请遵循“署名-相同方式共享 4.0 国际 (CC BY-SA 4.0)”协议。