-moz-outline-radius
非标准: 该特性是非标准的,请尽量不要在生产环境中使用它!
在包括 Firefox 在内的 Mozilla 的应用里, -moz-outline-radius
CSS 属性可以用作给一个元素 outline
圆角。
/* 一个值 */
-moz-outline-radius: 25px;
/* 两个值 */
-moz-outline-radius: 25px 1em;
/* 三个值 */
-moz-outline-radius: 25px 1em 12%;
/* 四个值 */
-moz-outline-radius: 25px 1em 12% 4mm;
/* 全局值 */
-moz-outline-radius: inherit;
-moz-outline-radius: initial;
-moz-outline-radius: unset;
这个属性是以下四个属性的简写:-moz-outline-radius-topleft
、 -moz-outline-radius-topright
、 -moz-outline-radius-bottomright
和 -moz-outline-radius-bottomleft
。
初始值 | as each of the properties of the shorthand: |
---|---|
适用元素 | all elements |
是否是继承属性 | 否 |
Percentages | as each of the properties of the shorthand:
|
计算值 | as each of the properties of the shorthand:
|
Animation type | as each of the properties of the shorthand:
|
语法
值
备注: 省略的 outlines 和 <percentage>
的值与 border-radius
中描述的语法一致。
一个、两个、三个或四个 <outline-radius>
的值,代表着以下数值之一:
<length>
- : 可能的值请参考
<length>
。
- : 可能的值请参考
<percentage>
- : 一个
<percentage>
;详情请参考border-radius
。
- : 一个
- 如果仅有一个值,这个值应用到全部四个角。
- 如果设置了两个值,第一个值应用于左上角个右下角,第二个值应用于右上角和左下角。
- 如果设置了三个值,第一个值应用于左上角,第二个值应用于右上角个左下角,第三个值应用于右下角。
- 如果设置了四个值,第一个值应用于左上角,第二个值应用于右上角,第三个值应用于右下角,第四个值应用于左下角。
形式语法
Error: could not find syntax for this item
示例
HTML
<p>This element has a rounded outline!</p>
CSS
p {
margin: 5px;
border: 1px solid black;
outline: dotted red;
-moz-outline-radius: 12% 1em 25px;
}
结果
备注
- 直至 Firefox 50 之前,
dotted
或dashed
圆角被渲染为 solid,详见 bug 382721 - 未来的 Gecko/Firefox 版本可能完全弃用这个属性。详见 bug 593717.
规范
这个属性没有在任何 CSS 标准中被定义。
浏览器兼容性
BCD tables only load in the browser