CSS outline-width attribute

Definition and Usage

The outline-width property sets the width of the entire outline of the element. This width will only take effect if the outline style is not none. If the style is none, the width will actually reset to 0. Negative length values are not allowed.

The outline (outline) is a line drawn around the element, located outside the edge of the border, and can highlight the element. The outline property sets the outline line around the element.

Note:Always declare the outline-style property before the outline-width property. The element must have an outline before its color can be changed.

Note:The outline line does not take up space and does not necessarily have to be rectangular.

See Also:

CSS Tutorial:CSS προφίλ

CSS Reference Manual:outline Property

HTML DOM Reference Manual:outlineWidth Property

Example

Set the color of the dotted outline:

p
  {
  outline-style:dotted;
  outline-width:5px;
  }

Try It Yourself

CSS Syntax

outline-width: medium|thin|thick|length|initial|inherit;

Property Value

Value Description
thin Specify a thin outline.
medium Default. Specifies a medium outline.
thick Specifies a thick outline.
length Allows you to specify the value of the outline thickness.
inherit Specifies that the outline width setting should be inherited from the parent element.

Technical Details

Default Value: medium
Inheritance: no
Version: CSS2
JavaScript Syntax: object.style.outlineWidth="thin"

Try It Yourself Example

Setting the outline width
This example demonstrates how to set the outline width.

Browser support

The numbers in the table indicate the first browser version that fully supports this property.

Chrome IE / Edge Firefox Safari Opera
1.0 8.0 1.5 1.2 7.0

Note:If !DOCTYPE is specified, IE8 supports the outline property.