Set the Border Color

By Stephen Bucaro

Set the border color using the border-color property. You can define the color by using the color name, hexadecimal notation, or the rgb tripplet method.

Border color set to #00ff00 - hexadecimal notation for "green"

Color defined by hexadecimal notation:

<p style="border-style:solid; border-color:#00ff00">Border color set to #00ff00 - hexadecimal notation for "green"</p>

Color defined by color name:

<p style="border-style:solid; border-color:green">Border color set using color name</p>

Color defined by using rgb tripplet:

<p style="border-style: solid; border-color: rgb(0,255,0)">Border color set using rgb tripplet</p>

The method shown below sets the color of all four borders. You can also set a different color for each border. The order of the values is top, right, bottom, left.

<p style="border-style: solid; border-color: #ff0000 #00ff00 #0000ff #000000">Set a different color for each border</p>

Set a different color for each border

 The "border-style" property must be set to a style other than "none" before setting the "border-color".