Back to CSS1 Reference | CSS1 Properties
Prev border-right-width | Next border-top


Property
border-style
Values
none, dotted, dashed, solid, double, groove, ridge, inset, outset
Initial
none
Inherited
no

The 'border-style' property sets the style of the four borders. It can have from one to four values, and the values are set on the different sides as for 'border-width'.

      #xy34 { border-style: solid dotted }

In the above example, the horizontal borders will be 'solid' and the vertical borders will be 'dotted'.

Since the initial value of the border styles is 'none', no borders will be visible unless the border style is set.

The border styles mean:

none
no border is drawn (regardless of the 'border-width' value)
dotted
the border is a dotted line drawn on top of the background of the element
dashed
the border is a dashed line drawn on top of the background of the element
solid
the border is a solid line
double
the border is a double line drawn on top of the background of the element. The sum of the two single lines and the space between equals the <border-width> value.
groove
a 3D groove is drawn in colors based on the <color> value.
ridge
a 3D ridge is drawn in colors based on the <color> value.
inset
a 3D inset is drawn in colors based on the <color> value.
outset
a 3D outset is drawn in colors based on the <color> value.

CSS1 core: UAs may interpret all of 'dotted', 'dashed', 'double', 'groove', 'ridge', 'inset' and 'outset' as 'solid'.

Log in or register to write something here or to contact authors.