CSS outline Property
Set an outline around a <h2> element and a <div> element:
outline: 5px dotted green;
outline: 2px dashed blue;
Definition and Usage
An outline is a line that is drawn around elements, outside the borders, to make the element "stand out".
outline property is a shorthand property for:
- outline-style (required)
If outline-color is omitted, the color applied will be the color of the text.
Note: Outlines differ from borders! Unlike border, the outline is drawn outside the element's border, and may overlap other content. Also, the outline is NOT a part of the element's dimensions; the element's total width and height is not affected by the width of the outline.
|Default value:||medium invert color|
|Animatable:||yes, see individual properties. Read about animatable Try it|
The numbers in the table specify the first browser version that fully supports the property.
|outline-width||Specifies the width of outline||Try it »|
|outline-style||Specifies the style of the outline||Try it »|
|outline-color||Specifies the color of the outline||Try it »|
|initial||Sets this property to its default value. Read about initial|
|inherit||Inherits this property from its parent element. Read about inherit|
CSS tutorial: CSS Outline
HTML DOM reference: outline property