HTML and CSS Reference
CSS does not specify the numerical thickness of these three keywords, but they
typically render as 1px, 3px, and 5px, respectively. Like border-width , the initial value for
this property is medium .
The color of the outline can be changed with the outline-color property. In addition to
the standard color notations, the keyword invert is also a valid value for this property.
outline-color : invert | <color>
To ensure proper contrast, the specification suggests that the default value be
invert , which sets the outline to the opposite of the color underneath. However,
only IE8+ and Opera 7+ actually support this value, so it is not commonly used.
outline is a shorthand property for setting all the preceding outline properties in a single
outline : <outline-width> + <outline-style> + <outline-color>
The values can be specified in any order because there is no ambiguity between
them. Either one of them can be left out.
outline: thin solid red;
This has the same effect as setting all the individual properties, but with a more
The space between the outline and the border edge can be set with the outline-offset
property introduced in CSS 3.
outline-offset : <length>
The following declaration moves the outline 3 pixels outward. Negative values are
allowed, which instead move the outline inside the element.
Although this property is not supported in IE, it works in all other major browsers.