Specifies a style for a border.
Platform Support
| IE | Netscape | Mozilla | Opera | Safari | 4.0+ | 4.0+ | 1.0+ | 5.0+ | 1.0+ |
|---|
Usage
[border-top-style] [border-right-style] [border-bottom-style] [border-left-style]
Values
| inherit | Inherit the value from the parent element. |
| none | No border. |
| dotted | Dotted line. |
| dashed | Dashed line. |
| solid | Solid line. |
| double | Double line. |
| groove | Grooved line. |
| ridge | Ridged line. |
| inset | Inset line. |
| outset | Outset line. |
| hidden | Hidden border. |
Example
To specify a border style that is solid on top, ridged on the right and bottom, and solid on the left, use the following syntax: .myborderclass {border-style: solid ridged ridged solid;}.
Remarks
Use the border-style property as a shortcut to typing out all of the individual border-style properties separately. You can specify any valid value for a border-style- property as part of border-style.
You can specify up to four different border styles for the border of an element.
- For border that is the same on all four sides, specify a single value.
- For border that is different on the top/bottom and left/right sides, specify two values with the top/bottom value first.
- For border that is different on the top, left/right, and bottom sides, specify three values with the top value first, followed by the left/right and then bottom values.
- For border with four different styles, specify four values in the order of top, right, bottom, and left.
Availability
W3C CSS2
