Defines the properties for an outline drawn over the outer edge of an element. Outlines differ from borders in that borders are drawn to the outside of the element.
Platform Support
IE | Netscape | Mozilla | Opera | Safari | no | 6.0+ | no | 7.0+ | 1.2+ |
---|---|---|---|---|
|
Usage
[color] [style] [width]
Values
inherit | Inherit the value from the parent element. |
#ffffff | outline-color: Color placeholder. e.g. #ffffff = white |
none | outline-style: No outline. |
dotted | outline-style: Dotted line. |
dashed | outline-style: Dashed line. |
solid | outline-style: Solid line. |
double | outline-style: Double line. |
groove | outline-style: Grooved line. |
ridge | outline-style: Ridged line. |
inset | outline-style: Inset line. |
outset | outline-style: Outset line. |
hidden | outline-style: Hidden outline. |
thin | outline-width: Thin outline. |
medium | outline-width: Medium outline. |
thick | outline-width: Thick outline. |
Example
To specify a thick, red, dashed outline, use the following syntax: .myoutlineclass {outline: thick red dashed;}
.
For a demonstration of the outline attributes, see the demo page on quirksmode:
http://www.quirksmode.org/css/outline.html
Remarks
Use the outline
property as a shortcut to typing out all of the individual outline
properties separately. You can specify any valid value for a outline
property as part of outline
.
Availability
W3C CSS2