Skip to content
Related Articles

Related Articles

Improve Article

CSS | border-right-color Property

  • Last Updated : 07 Aug, 2019

The border-right-color Property is used to set the color of the right-border in an Element. It is mandatory to declare the border-style or the border-left-style property before the border-right-color property.

Syntax:

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

Property Values

color:It sets the color of the Element’s right-border.

  • Syntax:
    border-right-color: color;
  • Example:




    <!DOCTYPE html>
    <html>
      
    <head>
        <title>
           CSS | border-right-color Property
        </title>
        <style>
            h1 {
                color: green;
            }
              
            h3 {
                border: 2px solid green;
                border-right-color: red;
                width: 50%;
            }
        </style>
    </head>
      
    <body>
        <center>
      
            <h1>GeeksForGeeks</h1>
            <h2>border-right-color:color;</h2>
            <h3>GeeksForGeeks</h3>
            
            <p style="border-style:dotted;
                      border-right-color:coral;
                      width:70%;">
                It is a computer science portal for geeks.</p>
      
    </body>
      
    </html>
  • Output:

Transparent:It specify the transparent value of right-border.

  • Syntax:
    border-right-color:transparent;
  • Example:




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

initial:It sets the Property to its default value.

  • Syntax:
    border-right-color:initial;
  • Example:




    <!DOCTYPE html>
    <html>
      
    <head>
        <title>
           CSS | border-right-color Property
        </title>
        <style>
            h1 {
                color: green;
            }
              
            h3 {
                border: 2px solid green;
                border-right-color: initial;
                width: 50%;
            }
        </style>
    </head>
      
    <body>
        <center>
      
            <h1>GeeksForGeeks</h1>
            <h2>border-right-color:initial;</h2>
            <h3>GeeksForGeeks</h3>
            
            <p style="border-style:dotted;
                      border-right-color:
                      initial;width:70%;">
              It is a computer science portal for geeks.</p>
      
    </body>
      
    </html>
  • Output:

Supported Browsers: The browser supported by css border-right-color property are listed below:

  • Google Chrome 1.0
  • Internet Explorer 4.0
  • Firefox 1.0
  • Opera 3.5
  • Apple Safari 1.0



My Personal Notes arrow_drop_up
Recommended Articles
Page :