Border-Left-Style

Set the style of the left border.

Syntax
      border-left-style: Style ; 

Styles:
none - No border and the computed border-width is zero.
hidden - No border, not even in a table where an adjacent (collapsed) cell exists.
dotted - A dotted border.
dashed - A dashed border.
solid - A solid border.
double - A double border. This does not make the border any wider.
groove - A 3D grooved border. The effect depends on the border-color value.
ridge - A 3D ridged border. The effect depends on the border-color value.
inset - A 3D inset border. The effect depends on the border-color value.
outset - A 3D outset border. The effect depends on the border-color value.
inherit - Inherit the border style from the parent element.

Examples:
h1 { border-left-style: double; }
.emw3class { border-left-style: solid; }

#emw3id { border-left-style: dotted; }

Try it:

This is a sample of text with a CSS border. Each of the 4 borders can be styled separately with CSS.

(CSS 1) Browser Support: All major browsers, IE 1.0 - IE 7 do not support hidden or inherit, IE 1.0 - IE 8 and Chrome Versions 2 & 3 may fail to display 1px dashed borders.

“The love of one's country is a splendid thing. But why should love stop at the border?” ~ Pablo Casals

Related:

border-left-style - MDN Web Docs.
border-style - Style all four borders.
border-bottom-style - Style of the bottom border.
border-right-style - Style of the right border.
border-top-style - Style of the top border.
border-left-width - Width of the left border.
border-left-color - Color of the left border.
color - Text color.


Copyright © 2013-2022 Emw3.com
Some rights reserved