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


CSS border-left-color用法及代码示例


border-left-color属性用于设置元素中left-border的颜色。必须在border-left-color属性之前声明border-style属性或border-left-style属性。

用法:

border-left-color:color|transparent|initial|inherit; 

属性值


color:设置元素的left-border的颜色。

  • 用法:
    border-left-color:color
  • 例:
    <!DOCTYPE html> 
    <html> 
      
    <head> 
        <title> 
            CSS | border-left-color Property 
        </title> 
        <style> 
            h1 { 
                color:green; 
            } 
              
            h3 { 
                border:2px solid green; 
                border-left-color:red; 
                width:50%; 
            } 
        </style> 
    </head> 
      
    <body> 
        <center> 
      
            <h1>GeeksForGeeks</h1> 
            <h2>border-left-color:color;</h2> 
            <h3>GeeksForGeeks</h3> 
            
            <!-- Sets the color-->
            <p style="border-style:dotted;  
                      border-left-color:coral;  
                      width:70%;"> 
              It is a computer science portal for geeks.</p> 
      
    </body> 
      
    </html></li>
  • 输出:
  • 透明:指定left-border的透明值。

    • 用法:
      border-left-color:transparent;
    • 例:
      <!DOCTYPE html> 
      <html> 
        
      <head> 
          <title> 
              CSS | border-left-color Property 
          </title> 
          <style> 
              h1 { 
                  color:green; 
              } 
                
              h3 { 
                  border:2px solid green; 
                  border-left-color:transparent; 
                  width:50%; 
              } 
          </style> 
      </head> 
        
      <body> 
          <center> 
        
              <h1>GeeksForGeeks</h1> 
              <h2>border-left-color:transparent</h2> 
              <h3>GeeksForGeeks</h3> 
        
              <!-- Sets the color to transparent-->
              <p style="border-style:dotted; 
                        border-left-color:transparent; 
                        width:70%;"> 
                It is a computer science portal for geeks.</p> 
        
      </body> 
        
      </html>
    • 输出:

    initial:将“属性”设置为其默认值。

  • 用法:
    border-left-color:initial;
  • 例:
    <!DOCTYPE html> 
    <html> 
      
    <head> 
        <title> 
            CSS | border-left-color Property 
        </title> 
        <style> 
            h1 { 
                color:green; 
            } 
              
            h3 { 
                border:2px solid green; 
                border-left-color:initial; 
                width:50%; 
            } 
        </style> 
    </head> 
      
    <body> 
        <center> 
      
            <h1>GeeksForGeeks</h1> 
            <h2>border-left-color:initial;</h2> 
            <h3>GeeksForGeeks</h3> 
      
            <!-- Sets the color to its default value-->
            <p style="border-style:dotted; 
                      border-left-color:initial; 
                      width:70%;"> 
              It is a computer science portal for geeks.</p> 
      
    </body> 
      
    </html>
  • 输出:

支持的浏览器:下面列出了css border-left-color属性支持的浏览器:

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


相关用法


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