outline-width

翻译不完整。 请帮助我们翻译这篇文章!

CSS 属性 outline-width 用于设置一个元素的轮廓的厚度。元素轮廓是绘制于元素周围的一条线,位于 border 的外围。

大多情况下用简写属性 outline 定义轮廓外观会更方便。

Syntax

/* Keyword values */
outline-width: thin;
outline-width: medium;
outline-width: thick;

/* <length> values */
outline-width: 1px;
outline-width: 0.1em;

/* Global values */
outline-width: inherit;

outline-width 的值可以是下面列表中的任一项。

Values

<length>
The width of the outline specified as a <length>.
thin
取决于用户代理。通常等同于桌面浏览器的 1px (包括 Firefox)。
medium
取决于用户代理。通常等同于桌面浏览器的 3px (包括 Firefox)。
thick
取决于用户代理。通常等同于桌面浏览器的 5px(包括 Firefox)。

Formal syntax

<line-width>

where
<line-width> = <length> | thin | medium | thick

Examples

HTML

<span id="thin">thin</span>
<span id="medium">medium</span>
<span id="thick">thick</span>
<span id="twopixels">2px</span>
<span id="oneex">1ex</span>
<span id="em">1.2em</span>

CSS

span {
  outline-style: solid;
  display: inline-block;
  margin: 20px;
}

#thin {
  outline-width: thin;
}

#medium {
  outline-width: medium;
}

#thick {
  outline-width: thick;
}

#twopixels {
  outline-width: 2px;
}

#oneex {
  outline-width: 1ex;
}

#em {
  outline-width: 1.2em;
}

Specifications

Specification Status Comment
CSS Basic User Interface Module Level 3
outline-width
Recommendation No change.
CSS Transitions
outline-width
Working Draft Defines outline-width as animatable.
CSS Level 2 (Revision 1)
outline-width
Recommendation Initial definition.
初始值medium
适用元素all elements
是否是继承属性
计算值an absolute length; if the keyword none is specified, the computed value is 0
Animation typea length

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
outline-widthChrome Full support 1Edge Full support 12Firefox Full support 1.5
Full support 1.5
No support 1 — 3.6
Prefixed
Prefixed Implemented with the vendor prefix: -moz-
IE Full support 8Opera Full support 7Safari Full support 1.2WebView Android Full support 37Chrome Android Full support 18Firefox Android Full support 4Opera Android Full support 14Safari iOS Full support 1Samsung Internet Android Full support 1.0

Legend

Full support  
Full support
Requires a vendor prefix or different name for use.
Requires a vendor prefix or different name for use.