Export (0) Print
Expand All
Information
The topic you requested is included in another documentation set. For convenience, it's displayed below. Choose Switch to see the topic in its original location.

border-left-style property

Sets or retrieves the style of the left border of the object.

CSS Backgrounds and Borders Module Level 3, Section 4.2

Syntax

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

Property values

none

Initial value. Border is not drawn, regardless of any border-width.

dotted

Border is a dotted line. This value is supported on the Macintosh platform, as of a Windows Store app using JavaScript, and on the Windows platform, as of a Windows Store app using JavaScript. It renders as a solid line on UNIX platforms, and on Windows systems running earlier versions of a Windows Store app using JavaScript.

hidden
dashed

Border is a dashed line.

solid

Border is a solid line.

double

Border is a double line drawn on top of the background of the object. The sum of the two single lines and the space between equals the border-width value. The border width must be at least 3 pixels wide to draw a double border.

groove

3-D groove is drawn in colors based on the value.

ridge

3-D ridge is drawn in colors based on the value.

inset

3-D inset is drawn in colors based on the value.

outset

3-D outset is drawn in colors based on the value.

window-inset

Same as inset with a thin outside border.

Property values

This property has no parameters.

CSS information

Applies ToAll elements
Mediavisual
Inheritedno
Initial Valuenone

Standards information

Remarks

A border-width greater than 0 must be set for the border-left-style attribute to render.

Examples

This example uses border-left-style to specify the left border style for a div element.


<body>
   <div id="left"></div> 
</body>

The CSS below specifies double as the default border style for div elements, then sets border-left-style to solid for the div element above. The following image shows the result, a solid left border.

An element with the border-left-style property specified


div {
   width: 50px;
   height: 50px;
   border-width: 5px;
   border-style: double;
   border-color: #4169E1;			
}
#left {
   border-left-style: solid;
}

See also

CSSStyleDeclaration
currentStyle
defaults
runtimeStyle
style
border
border-right-style
border-top-style
border-bottom-style

 

 

Show:
© 2014 Microsoft