O'Reilly logo

CSS Pocket Reference, 4th Edition by Eric A. Meyer

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Name

outline

Values:

<'outline-color'> || <'outline-style'> || <'outline-width'>

Initial value:

Not defined for shorthand properties

Applies to:

All elements

Inherited:

No

Computed value:

See individual properties

Description:

This is a shorthand property that defines the overall outline for an element. The most common use of outlines is to indicate which form element or hyperlink currently has focus (accepts keyboard input). Outlines can be of irregular shape, and no matter how thick, they do not change or otherwise affect the placement of elements.

Examples:

*[href]:focus {outline: 2px dashed invert;}
form:focus {outline: outset cyan 0.25em;}

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required