Property Description
The outline-style property sets the style of an outline.
This property has the following syntax:
outline-style: none|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit;
Property Values
| Value | Description |
|---|---|
| none | (default) Specifies no outline |
| dotted | Specifies a dotted outline |
| dashed | Specifies a dashed outline |
| solid | Specifies a solid outline |
| double | Specifies a double outliner |
| groove | Specifies a 3D grooved outline. The effect depends on the outline-color value |
| ridge | Specifies a 3D ridged outline. The effect depends on the outline-color value |
| inset | Specifies a 3D inset outline. The effect depends on the outline-color value |
| outset | Specifies a 3D outset outline. The effect depends on the outline-color value |
| initial | Specifies that the value of the property should be set to the default value |
| inherit | Specifies that the value of the property should be inherited from the parent element |
Examples
This example sets the outline style to dotted for all paragraph elements.
p {
outline-style: dotted;
}This example shows the results of setting the various outline-style values:
outline-style: none
outline-style: dotted
outline-style: dashed
outline-style: solid
outline-style: double
outline-style: groove
outline-style: ridge
outline-style: inset
outline-style: outset
outline-style: dotted
outline-style: dashed
outline-style: solid
outline-style: double
outline-style: groove
outline-style: ridge
outline-style: inset
outline-style: outset
Browser Support
| Chrome | Firefox | IE | Safari | Opera |
|---|---|---|---|---|
| 1.0 | 1.5 | 8.0 | 1.2 | 7.0 |
Miscellaneous Information
| Inherited: | No |
|---|---|
| Defined In: | CSS2 |
| Default Value: | none |