CSS Property outline-style
outline-style sets the style for the overall border of an element.
Summary
| Item | Value |
|---|---|
| Initial value | none |
| Inherited | No. |
| Version | CSS2 |
| JavaScript syntax | object.style.outlineStyle="dotted" |
| Applies to | All elements. |
CSS Syntax
outline-style: dashed |
dotted |
double |
groove |
inset |
none |
outset |
ridge |
solid |
inherit
Property Values
The property values are listed in the following table.
| Value | Description |
|---|---|
| none | no outline |
| hidden | hidden outline |
| dotted | dotted outline |
| dashed | dashed outline |
| solid | solid outline |
| double | double outliner |
| groove | 3D grooved outline which depends on the outline-color value |
| ridge | 3D ridged outline which depends on the outline-color value |
| inset | 3D inset outline which depends on the outline-color value |
| outset | 3D outset outline which depends on the outline-color value |
| inherit | Inherit the outline style from the parent element |
Browser compatibility
 |
 |
 |
 |
 |
|
|---|---|---|---|---|---|
outline-style |
Yes | 8.0 | Yes | Yes | Yes |
Example
An example showing how to use outline-style CSS property.
<!DOCTYPE html>
<html>
<head>
<style>
p{<!--from ww w. j a v a 2 s . co m-->
border:1px solid red;
outline-style:dotted;
outline-color:#00ff00;
}
</style>
</head>
<body>
<p>paragraph.</p>
</body>
</html>