The **`border-left`** property in CSS is used to define the properties of the bottom left, such as style, color, and width, all in just one line.

`border-left` is a shorthand property of the following:
- `border-left-width`
- `border-left-style`
- `border-left-color`

> `border-left-style` is compulsory to define.

#     
## Syntax
```css
border-left: border-width border-style border-color|initial|inherit;
```

## Property values

- `border-left-width:` Specifies the width of the border. The default value is `Medium`.

- `border-left-style:` Sets the style of the border. The default value is `NULL`. 

- `border-left-color:` Sets the color of the border.

- `initial:` Sets the value to its default value.

- `inherit:` Inherits property from its parent value.

## Code




<!DOCTYPE html>
<title>Test Program</title>

<div class="bdr">
Welcome To Educative Edpresso Shots
</div>

.bdr {
    border-left: 5px solid blueviolet;
}

codemirror

In this example, we set the left border, and the color is set to violet. If we want to change the left border color, we select the color of our choice.  

What is the CSS border-left property?

Defines left border properties—style, color, width—in one line. Style definition is mandatory.