HTML and CSS Reference
In-Depth Information
border-color
border-color
sets the color of the border. CSS does not specify what the default border
color should be, but most browsers render it gray. This property can have from one to four
values and has four subproperties for setting the individual borders' color.
border-color (1-4) | border-top-color |
border-right-color | border-bottom-color |
border-left-color :
<color> | transparent
Setting the color to transparent makes the border invisible without changing the layout.
border-color: transparent;
border
The
border
property can set the width, style and color border properties in a single
declaration. It is the most commonly used property for controlling the border.
border | border-top | border-right |
border-bottom | border-left :
<border-width> + <border-style> + <border-color>
The values can be set in any order because there is no ambiguity between them.
Either one of the values can also be omitted.
border: 1px solid black;
The
border
property has four subproperties for specifying the border settings for
each of the four sides.
border-top: 1px solid red;
border-right: 1px solid blue;
border-bottom: 1px solid aqua;
border-left: 1px solid lime;
border-radius
The corners of the border can be rounded using the
border-radius
property or its four
subproperties.
border-radius (1-4) | border-top-left-radius |
border-top-right-radius | border-bottom-right-radius |
border-bottom-left-radius :
<length> | <percentage> [ / <length> | <percentage> ]
