CSS reference manual

CSS @rules

CSS attributes大全

CSS outline-color attribute CSS3 order attribute

CSS outline property usage and examples

The outline property sets the width, style, and color of all four sides of the element's outline. It is used to set various outline properties in a single declaration (i.e.,outline-width,outline-styleAndoutline-colorAbbreviated property of ).

The following table provides usage instructions and version history of this property, as well as the syntax for using this property in JavaScript scripts.

Default value:	View all properties
Applicable to:	All elements
Inheritance:	None
Animated production:	Yes, because some properties of shorthand can be animated.Please refer to Animation properties.
Version:	CSS 2,3
JavaScript syntax:	object.style.outline="#cc0000 dotted thin"

Outline usage syntax

The syntax of this attribute is as follows:

outline: [ outline-width outline-style outline-color ] | initial | inherit

Note:If any of the listed properties are missing or omitted, the default value of the attribute (if any) will be inserted. For more details, please refer to each property.

The following example demonstrates how to use the outline attribute.

Example

　　p.one {
　　　outline:　2px solid #ff0000;
　　}
　　p.two {
　　　color: #00ff00;
　　　outline-top:　5px solid;
　　}

Test and see‹/›

Note:Ifoutline-colormissing or not specified (e.g., outline:) 5px solid;), then the following value will be usedcolorelement attribute value. However, in some special cases, omittingoutline-styleThis value will not display any outline because the outline-The default value of styleproperty is none.

Attribute value

The following table describes the value of this attribute.

Value	Description
outline-width	Set the width of the element outline.
outline-style	Set the line style of the element outline.
outline-color	Set the color of the element outline.
initial	Set this attribute to its default value.
inherit	If specified, the associated elements will adopt the attribute value of the outline of its parent element.

Browser compatibility

The compatibility of the outline attribute of browsers, the numbers in the following table represent the minimum version number of browsers that support this attribute; all mainstream browsers support this attribute.

	Firefox 1.5Above Google Chrome1+ Internet Explorer 8+ Apple Safari 1.2+ Opera 7+

Warning: Internet Explorer 7and earlier versions do not support this outline attribute. IE8Supports this attribute, but requires an effective<!DOCTYPE>.

For further reading

Please refer to the following tutorial:CSS outline,CSS border.

Related properties:outline-width,outline-style,outline-color

CSS outline-color attribute CSS3 order attribute