CSS outline-style Property
Example
Set the style of the outline:
Property Definition and Usage
The outline is a line drawn around elements, outside the border edge.
The outline-style property specifies the style of the outline.
| Default value: | none |
|---|---|
| Inherited: | no |
| --- | --- |
| Version: | CSS2 |
| --- | --- |
| JavaScript syntax: | object.style.outlineStyle="dotted" |
| --- | --- |
Browser Support
The numbers in the table specify the first browser version that fully supports the property.
| Property | |||||
|---|---|---|---|---|---|
| outline-style | 1.0 | 8.0 | 1.5 | 1.2 | 7.0 |
Tips and Notes
The outline surrounds an element. It is around the margin of the element. However, it is different from the border properties.
The outline is not part of the element's dimensions, so the element's width and height properties do not include the width of the outline.
Property Values
| Value | Description |
|---|---|
| none | Default. Defines no outline. |
| dotted | Defines a dotted outline. |
| dashed | Defines a dashed outline. |
| solid | Defines a solid outline. |
| double | Defines a double outline. The width of the two lines is equal to the value of outline-width. |
| groove | Defines a 3D grooved outline. The effect depends on the outline-color value. |
| ridge | Defines a 3D ridged outline. The effect depends on the outline-color value. |
| inset | Defines a 3D inset outline. The effect depends on the outline-color value. |
| outset | Defines a 3D outset outline. The effect depends on the outline-color value. |
| inherit | Specifies that the outline style should be inherited from the parent element. |
More Examples
Related Articles
CSS Tutorial: CSS Outline
CSS Reference Manual: outline Property