CSS Reference Manual

CSS @rules (RULES)

Complete List of CSS Properties

CSS3 border-image attribute CSS border-collapse attribute

CSS border-Usage and examples of color property

border-The color CSS property is used to set the single border color property, which is a shorthand notation property;border-top-color,border-right-color,border-bottom-colorAndborder-left-colorFor a single declaration.

The following table provides usage instructions and version history of this property, as well as the syntax for using this property in JavaScript scripts.

Default value:	View all properties
Applicable to:	All elements
Inheritance:	None
Animation can be made:	Yes.Please refer to Animation properties.
Version:	CSS 1,2,3
JavaScript syntax:	object object.style.borderColor="#cc0000 red"

border-color usage syntax

The syntax of this attribute is as follows:

border-color:　[　color　|　transparent　]　1　to　4　values　|　inherit

This shorthand notation can take one, two, three, or four space-separated values.

If specifiedOne valueIt will be applied to all borders.
If specifiedTwo valuesThe first value is used for the top and bottom borders, while the second value is used for the right and left borders.
If specifiedThree valuesThe first value is used for the top border, the second value for the right and left borders, and the third value for the bottom border
If specifiedFour valuesIf specified, each value will be applied to the border in the order of top, right, bottom, and left.

The following examples demonstrate how to use border-color attribute.

Example

　　p　{
　　　border-style:　solid;
　　　border-color:　#ff0000;
　　}

Test to see‹/›

Note:You must specify in border-color attribute is declared beforeborder-styleAttribute. The element must have a border before setting the border color, becauseborder-styleThe default value of the attribute is none.

Attribute values

The following table describes the values of this attribute.

Value	Description
color	Specify the border color. SeeCSS color valuesto get a list of possible color values.
transparent	Allow the border to be transparent, although it may take upborder-widthSpace occupied by the property.
initial	Set this property to its default value.
inherit	If specified, the associated element uses its parent element's border-color attribute values.

Browser compatibility

border-Browser compatibility of the color attribute, the numbers in the table below represent the minimum version number of the browser that supports this attribute; all mainstream browsers support this attribute.

	Firefox 1+ Google Chrome1+ Internet Explorer 4+ Apple Safari 1+ Opera 4+