CSS Border-style Property

The border-style is the short-hand way, of setting the style of all the borders.

Possible Values

  • none [no border]
  • hidden [same as none?]
  • dotted [dotted border]
  • dashed [dashed border]
  • solid [solid border]
  • double [Two borders, width of each is same as border-width value]
  • groove [3D-like effect, depends on border-color value]
  • ridge [3D-like effect, depends on border-color value]
  • inset [3D inset border. effect, depends on border-color value]
  • outset [3D outset border. effect, depends on border-color value]
div {
  border-style: double;
}

Note the format when using short-hand specifications is TOP|RIGHT|BOTTOM|LEFT

div {
  border-style: double dashed solid dashed;
}

In the above example, it should be obvious that we are setting the border as follows: Top is Double, Right is Dashed, Bottom is Solid, left is Dashed.

Inherited? NO!

Post comment

Links that you insert are not nofollowed, but will be removed by admins if they are considered spam.

[url=Absolute URL for page]TITLE[/url]

You should insert code boxes around code examples, which will be automatically syntax highlighted.

[code1 html|css|javascript|php|sql]Your Code Here[/code1]

You may want to read our Privacy Policy before submitting your comment.