CSS outline-style property
CSS Outline outline-style Property
Description
The outline-style property determines the style of the outline around an element.
Possible Values
- none – No outline is drawn.
-
dotted – The outline is drawn using a series of dots.
-
dashed – The outline is drawn as a series of short line segments.
-
solid – The outline is drawn as a single, unbroken line.
-
double – The outline is drawn as a pair of unbroken lines.
-
groove – The outline is drawn as if a groove were carved into the document surface.
-
ridge – The outline is drawn as if a ridge were pushed up from the document surface.
-
inset – The outline is drawn as if the entire element were pushed away from the document surface.
-
outset – The outline is drawn in such a way that it appears as if the entire element is pushed toward the user.
Applies to
All HTML elements.
DOM syntax
object.style.outlineStyle = "solid";
Example
This is an example−
<html>
<head>
</head>
<body>
<p style = "outline-width:thin; outline-style:solid;">
This text is having thin solid outline. </p>
<br />
<p style = "outline-width:thick; outline-style:dashed;">
This text is having thick dashed outline.
</p>
<br />
<p style = "outline-width:5px;outline-style:dotted;">
This text is having 5x dotted outline.
</p>
</body>
</html>
This will produce the following results−
