CSS - Border Color


 CSS - Border Color   

  • The border-color property is used in CSS to choose the color for the border. 
  • Its value should either be a color name, a hex color, or an RGB value.

Sample Code :

<!DOCTYPE html>
<html>
    <head>
    </head>
        <body>
            <p style="border-width: thin; border-style: solid; border-color: red">
                Welcome To WikiTechy.com
            </p>
            <br />
            <p style="border-width: thick; border-style: dashed; border-color: #009900">
                Where You Can Learn All The Technologies.
            </p>
            <br />
            <p style="border-width: 5px; border-style: dotted; border-color: rgb(13,33,232)">
                Best E-Learning Website in The World.
            </p>
        </body>
</html>

Code Explanation :


   In CSS, border-color : red is used for applying red color for the border around p tag.

  Here, we are Applying hexadecimal color values for border in border-color property.

  • Note : RGB values can also be assigned using hexadecimal color values in the form of : #RRGGBB, where RR (red), GG (green) and BB (blue) are hexadecimal values between 00 and FF (same as decimal 0-255).

  Here, p element was defined for the statement “Best E-Learning Website in the World” where the border for the statement is applied with RGB Colors values which specify its color values based on the formula (red, green, and blue).

Output :


  Here red color value is applied for the border around the text “Welcome To WikiTechy.com” shown in solid border.

   The Text “Where You Can Learn All the Technologies Easily” will have a dashed border in green color border which is specified in Hexadecimal. 

  Over here, the RGB color values is applied for the text “Best E-Learning Website in the World.” which will be displayed with blue color with dotted border.