Change Language


Follow Navioo On Twitter

border-style

Specifies a style for a border.

Browser/User Agent 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

Related

Ajax Javascript feed

↑ Grab this Headline Animator