CSS/Properties/outline-style
From W3C Wiki
< CSS | Properties
- List of Properties
- Outline
- outline-width
- outline-style
- outline-color
- outline
- Outline
Contents |
outline-style
The outline-style property specify the line style of the outline of a box. This property accepts the same values as 'border-style', except that 'hidden' is not a legal outline style.
Description
| Values | [none | dotted | dashed | solid | double | groove | ridge | inset | outset] | inherit |
|---|---|
| Initial value | none |
| Applies to | all elements |
| Inherited | No |
Values
none
No border.
dotted
The border is a series of dots.
dashed
The border is a series of short line segments.
solid
The border is a single line segment.
double
The border is two solid lines. The sum of the two lines and the space between them equals the value of 'border-width'.
groove
The border looks as though it were carved into the canvas.
ridge
The opposite of 'groove': the border looks as though it were coming out of the canvas.
inset
The border makes the box look as though it were embedded in the canvas.
outset
The opposite of 'inset': the border makes the box look as though it were coming out of the canvas.
inherit
Takes the same specified value as the property for the element's parent.
Example
Example A
[style.css]
h1 {
outline-width: 1px;
outline-style: solid;
}
[index.html]
<body>
<h1>CSS outline property example</h1>
</body>
CSS Reference
The CSS specification defines the outline-style property in 18.4 Dynamic outlines.
