The cover of The Complete Idiot's Guide to Create a Web Page The Complete Idiot's Style Sheets Reference

| Index | Current Category: Borders |
| Previous Style: border-left-color | Next Style: border-left-width |


border-left-style

Specifies the left border style of the element's box.

Support:

W3C StandardInternet ExplorerNetscape Navigator
CSS2 and later 4.0 and later 4.0 and later

See Also:

border-style, border-bottom-ctyle, border-right-style, border-top-style

Possible Values:

dashed
Renders the border as a series of dashes.

Support:

W3C StandardInternet ExplorerNetscape Navigator
CSS2 and later Not supported Not supported

dotted
Renders the border as a series of dots.

Support:

W3C StandardInternet ExplorerNetscape Navigator
CSS2 and later Not supported Not supported

double
Renders the border as a double line.

Support:

W3C StandardInternet ExplorerNetscape Navigator
CSS2 and later 4.0 and later Not supported

groove
Renders the border as a V-shaped line that appears to be etched into the page

Support:

W3C StandardInternet ExplorerNetscape Navigator
CSS2 and later 4.0 and later Not supported

hidden
Doesn't display a border.

Support:

W3C StandardInternet ExplorerNetscape Navigator
CSS2 and later Not supported Not supported

Notes:
  • This value is the same as none. It's used within a table that has separated borders.

inset
Renders the border as a line that appears to be sunken into the page.

Support:

W3C StandardInternet ExplorerNetscape Navigator
CSS2 and later 4.0 and later Not supported

none
Doesn't display a border.

Support:

W3C StandardInternet ExplorerNetscape Navigator
CSS2 and later 4.0 and later Not supported

outset
Renders the border as a line that appears to be raised from the page.

Support:

W3C StandardInternet ExplorerNetscape Navigator
CSS2 and later 4.0 and later Not supported

ridge
Renders the border as a V-shaped line that appears to be coming out of the page.

Support:

W3C StandardInternet ExplorerNetscape Navigator
CSS2 and later 4.0 and later Not supported

solid
Renders the border as a solid line.

Support:

W3C StandardInternet ExplorerNetscape Navigator
CSS2 and later 4.0 and later Not supported

Example:
<P STYLE="border-left-width: thick; border-left-style: double">
Double left border
<P STYLE="border-left-width: thick; border-left-style: groove">
Groove left border
<P STYLE="border-left-width: thick; border-left-style: inset">
Inset left border
<P STYLE="border-left-width: thick; border-left-style: outset">
Outset left border
<P STYLE="border-left-width: thick; border-left-style: ridge">
Ridge left border
<P STYLE="border-left-width: thick; border-left-style: solid">
Solid left border
How It Looks:

Double left border

Groove left border

Inset left border

Outset left border

Ridge left border

Solid left border


| Index | Current Category: Borders |
| Previous Style: border-left-color | Next Style: border-left-width |