CSS Border Styles

The border-style property specifies what kind of border to display.

Border Style

The following values are allowed:

  • dotted - Defines a dotted border
  • dashed - Defines a dashed border
  • solid - Defines a solid border
  • double - Defines a double border
  • 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
  • none - Defines no border
  • hidden - Defines a hidden border

Dotted Border

These divisions have dotted borders.

Foo
Bar
Baz
Foo
Bar
Baz

Dashed Border

Foo
Bar
Baz
Foo
Bar
Baz

Solid Border

Foo
Bar
Baz
Foo
Bar
Baz

Double Border

Foo
Bar
Baz
Foo
Bar
Baz

Groove Border

Foo
Bar
Baz
Foo
Bar
Baz

Ridge Border

Foo
Bar
Baz
Foo
Bar
Baz

Inset Border

Foo
Bar
Baz
Foo
Bar
Baz

Outset Border

Foo
Bar
Baz
Foo
Bar
Baz

None Border

Foo
Bar
Baz
Foo
Bar
Baz

Hidden Border