CSS outline Property
Clash Royale CLAN TAG#URR8PPP <!--
main_leaderboard, all: [728,90][970,90][320,50][468,60]-->
CSS outline Property
❮
Reference
❯
Example
Set an outline around a <h2> element and a <div> element:
h2
outline: 5px dotted green;
div.a
outline: 2px dashed blue;
Try it Yourself »
Definition and Usage
An outline is a line that is drawn around elements, outside the borders, to make the element "stand out".
The outline property is a shorthand property for:
- outline-width
outline-style (required)- outline-color
If outline-color is omitted, the color applied will be the color of the text.
Note: The outline is not a part of the element's dimensions, therefore the element's width and height properties do not contain the width of the outline.
| Default value: | medium invert color |
|---|---|
| Inherited: | no |
| Animatable: | yes, see individual properties. Read about animatable Try it |
| Version: | CSS2 |
| JavaScript syntax: | object.style.outline="#0000FF dotted 5px" Try it |
Browser Support
The numbers in the table specify the first browser version that fully supports the property.
| Property | |||||
|---|---|---|---|---|---|
| outline | 1.0 | 8.0 | 1.5 | 1.2 | 7.0 |
<!--
mid_content, all: [300,250][336,280][728,90][970,250][970,90][320,50][468,60]-->
CSS Syntax
outline: outline-width outline-style outline-color|initial|inherit;Property Values
| Value | Description |
|---|---|
| outline-width | Specifies the width of outline |
| outline-style | Specifies the style of the outline |
| outline-color | Specifies the color of the outline |
| initial | Sets this property to its default value. Read about initial |
| inherit | Inherits this property from its parent element. Read about inherit |
Related Pages
CSS tutorial: CSS Outline
HTML DOM reference: outline property
❮
Reference
❯