border-style

Sets the style of the border. The default value is none.

Syntax

border-style: <line-style>;

where <line-style> can be the following values:

• none
• hidden
• dotted
• dashed
• solid
• double
• groove
• ridge
• inset
• outset

Example 1

Set border of the h1 element to be green, 3 pixels thick, and dotted:

h1 {
  border-color: green;
  border-width: 3px;
  border-style: dotted;
}

The following image demonstrates the code block above:

Example 2

Set the top and bottom borders dashed and the left and right borders solid:

h1 {
  border-style: dashed solid;
}

The following image demonstrates the code block above: