CSS border-style Property


The border-style CSS property is a shorthand property that sets the line style for all four sides of an element’s border.

The border-style property sets the style of an element's four borders. This property can have from one to four values.

Examples:

  • border-style: dotted solid double dashed;
    • top border is dotted
    • right border is solid
    • bottom border is double
    • left border is dashed

  • border-style: dotted solid double;
    • top border is dotted
    • right and left borders are solid
    • bottom border is double

  • border-style: dotted solid;
    • top and bottom borders are dotted
    • right and left borders are solid

  • border-style: dotted;
    • all four borders are dotted

CSS Syntax

border-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit;

Example -