CSS outline property
➔ The outline property is a shorthand property and is used to set the following properties in order.
outline-widthoutline-style(required)outline-color
Syntax
outline: outline-width outline-style outline-color|initial|inherit;
Property values
| Common Value | Description |
|---|---|
| outline-width | Sets the width of the outline. |
| outline-style | Sets the style of the outline. |
| outline-color | Sets the color of the outline. |
| initial | Sets the property to its default value. |
| inherit | The element inherits the property value from its parent element. |
Example
.p1 {
outline: 5px solid red;
outline-offset: 1px;
border: 2px solid black;
}
.p2 {
outline: 5px double #32b853;
outline-offset: 2px;
border: 2px solid black;
}Click on the "Try it Now" button to see how it works.