CSS border-left-style attribute

Definition and usage

border-left-style sets the style of the left border of the element.

The border may only appear when this value is not none.

In CSS1, the HTML user agent only needs to support solid and none.

See also:

CSS Tutorial:CSS Κάθετος

CSS Reference Manual:border-left attribute

HTML DOM Reference Manual:borderLeftStyle property

Example

Set the style of the left border:

p
  {
  border-style:solid;
  border-left-style:dotted;
  }

Try it yourself

CSS syntax

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

Attribute value

Value Description
none Define no border.
hidden Same as "none". However, it does not apply to tables, for tables, "hidden" is used to resolve border conflicts.
dotted Define dotted border. It is usually displayed as a solid line in most browsers.
dashed Define dashed line. It is usually displayed as a solid line in most browsers.
solid Define solid line.
double Define double lines. The width of the double lines is equal to the value of border-width.
groove Define 3D grooved border. Its effect depends on the value of border-color.
ridge Define 3D embossed border. Its effect depends on the value of border-color.
inset Define 3D inset border. Its effect depends on the value of border-color.
outset Define 3D outset border. Its effect depends on the value of border-color.
inherit Specifies that the border style should be inherited from the parent element.

Technical details

Default value: not specified
Inheritance: no
Version: CSS1
JavaScript syntax: object.style.borderLeftStyle="dotted"

More examples

Set the style of the left border
This example demonstrates how to set the style of the left border.

Browser support

The numbers in the table indicate the first browser version that fully supports this attribute.

Chrome IE / Edge Firefox Safari Opera
1.0 5.5 1.0 1.0 9.2