首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

-moz-outline-width

outline-widthCSS属性设置元素的轮廓的宽度(厚度)。一个轮廓线是围绕着一个元素在border外面画的线。

outline定义轮廓的外观时使用速记属性通常更为方便。

代码语言:javascript
复制
/* 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等桌面浏览器中通常为3pxthick取决于用户代理。通常在Firefox等桌面浏览器中使用5px<length>轮廓的宽度指定为 <length>

正式语法

代码语言:javascript
复制
<br-width>where 
<br-width> = <length> | thin | medium | thick

示例

HTML

代码语言:javascript
复制
<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

代码语言:javascript
复制
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)

?

?

?

?

扫码关注腾讯云开发者

领取腾讯云代金券

http://www.vxiaotou.com