Easy Tutorial
❮ Prop Style Columns Jsref Undefined ❯

Style borderStyle Property


Definition and Usage

The borderStyle property sets or returns the style of an element's border.

This property can use from 1 to 4 styles:

Syntax

Set the borderStyle property:

Return the borderStyle property:

Value Description
none Default. Defines no border.
hidden Same as "none", except for table borders conflict resolution.
dotted Defines a dotted border.
dashed Defines a dashed border.
solid Defines a solid border.
double Defines a double border. The width of the double line is equal to the border-width value.
groove Defines a 3D grooved border. The effect depends on the border-color value.
ridge Defines a 3D ridged border. The effect depends on the border-color value.
inset Defines a 3D inset border. The effect depends on the border-color value.
outset Defines a 3D outset border. The effect depends on the border-color value.
inherit The border style is inherited from the parent element.

Browser Support

All major browsers support the borderStyle property.

Note: IE7 and earlier versions do not support the "inherit" value. IE8 supports "inherit" only if an !DOCTYPE is specified. IE9 supports "inherit".


Example

Change the style of all four borders:

❮ Prop Style Columns Jsref Undefined ❯