CSS border-left Property

Set the style of the CSS border-left for different elements:

h1 {
border-left: 5px solid red;

h2 {
border-left: 4px dotted blue;

div {
border-left: double;

Try it Yourself »

Definition and Usage

The border-left shorthand property sets all the left border properties in one declaration.

The properties that can be set must be in the following order:

  • border-left-width
  • border-left-style
  • border-left-color

If border-left-color is omitted, the color applied will be the color of the text.

Default value: medium none color
Inherited: no
Animatable: yes, see individual propertiesRead about animatable – Try it
Version: CSS1
JavaScript syntax: object.style.borderLeft=”3px dotted blue” Try it
CSS Syntax
border-left: border-width border-style border-color|initial|inherit;
Property Values
Value Description
border-left-width Required. Specifies the width of the left border. Default value is “medium”
border-left-style Required. Specifies the style of the left border. Default value is “none”
border-left-color Optional. Specifies the color of the left border. Default value is the color of the text
initial Sets this property to its default value. Read about initial
inherit Inherits this property from its parent element. Read about inherit