CSS Border Properties
The CSS border properties allow you to specify the style and color of an element's border. In HTML we use tables to create borders around a text, but with the CSS border properties we can create borders with nice effects, and it can be applied to any element.
Browser support:
IE: Internet Explorer, F: Firefox, N: Netscape.
W3C:
The number in the "W3C" column indicates in which CSS recommendation the property is defined (CSS1 or CSS2).
| Property | Description | Values | IE | F | N | W3C |
|---|---|---|---|---|---|---|
| border | A shorthand property for setting all of the properties for the four borders in one declaration |
border-width border-style border-color |
4 | 1 | 4 | 1 |
| border-bottom | A shorthand property for setting all of the properties for the bottom border in one declaration |
border-bottom-width border-style border-color |
4 | 1 | 6 | 1 |
| border-bottom-color | Sets the color of the bottom border | border-color | 4 | 1 | 6 | 2 |
| border-bottom-style | Sets the style of the bottom border | border-style | 4 | 1 | 6 | 2 |
| border-bottom-width | Sets the width of the bottom border |
thin medium thick length |
4 | 1 | 4 | 1 |
| border-color | Sets the color of the four borders, can have from one to four colors | color | 4 | 1 | 6 | 1 |
| border-left | A shorthand property for setting all of the properties for the left border in one declaration |
border-left-width border-style border-color |
4 | 1 | 6 | 1 |
| border-left-color | Sets the color of the left border | border-color | 4 | 1 | 6 | 2 |
| border-left-style | Sets the style of the left border | border-style | 4 | 1 | 6 | 2 |
| border-left-width | Sets the width of the left border |
thin medium thick length |
4 | 1 | 4 | 1 |
| border-right | A shorthand property for setting all of the properties for the right border in one declaration |
border-right-width border-style border-color |
4 | 1 | 6 | 1 |
| border-right-color | Sets the color of the right border | border-color | 4 | 1 | 6 | 2 |
| border-right-style | Sets the style of the right border | border-style | 4 | 1 | 6 | 2 |
| border-right-width | Sets the width of the right border |
thin medium thick length |
4 | 1 | 4 | 1 |
| border-style | Sets the style of the four borders, can have from one to four styles |
none hidden dotted dashed solid double groove ridge inset outset |
4 | 1 | 6 | 1 |
| border-top | A shorthand property for setting all of the properties for the top border in one declaration |
border-top-width border-style border-color |
4 | 1 | 6 | 1 |
| border-top-color | Sets the color of the top border | border-color | 4 | 1 | 6 | 2 |
| border-top-style | Sets the style of the top border | border-style | 4 | 1 | 6 | 2 |
| border-top-width | Sets the width of the top border |
thin medium thick length |
4 | 1 | 4 | 1 |
| border-width | A shorthand property for setting the width of the four borders in one declaration, can have from one to four values |
thin medium thick length |
4 | 1 | 4 | 1 |