-moz-outline-width
-moz-outline-width
outline-width
CSS属性设置元素的轮廓的宽度(厚度)。一个轮廓线是围绕着一个元素在border
外面画的线。
outline
定义轮廓的外观时使用速记属性通常更为方便。
/* 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;
初始值 | medium |
---|---|
适用元素 | all elements |
是否是继承属性 | no |
适用媒体 | visual, interactive |
计算值 | an absolute length; if the keyword none is specified, the computed value is 0 |
Animation type | a length |
正规顺序 | the unique non-ambiguous order defined by the formal grammar |
语法
该outline-width
属性被指定为下面列出的任何一个值。
值
thin取决于用户代理。在Firefox等桌面浏览器中通常为1 像素。medium取决于用户代理。在Firefox等桌面浏览器中通常为3px。thick取决于用户代理。通常在Firefox等桌面浏览器中使用5px。<length>轮廓的宽度指定为 <length>。
正式语法
<br-width>where
<br-width> = <length> | thin | medium | thick
示例
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;
}
规范
Specification | Status | Comment |
---|---|---|
CSS Basic User Interface Module Level 3The definition of 'outline-width' in that specification. | Candidate Recommendation | No change. |
CSS TransitionsThe definition of 'outline-width' in that specification. | Working Draft | Defines outline-width as animatable. |
CSS Level 2 (Revision 1)The definition of 'outline-width' in that specification. | Recommendation | Initial definition. |
浏览器兼容性
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|---|
Basic support | 1.0 | (Yes) | 1.5 (1.8)1 | 8.0 | 7.0 | 1.2 (125) |
Feature | Android | Edge | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | ? | (Yes) | ? | ? | ? | ? |