-moz-outline-radius

-moz-outline-radius

非标准

此功能是非标准的。不要在面向Web的生产站点上使用它：它并不适用于每个用户。实现之间也可能存在很大的不兼容性，而且这种行为在未来可能会发生变化。

在Firefox等Mozilla应用程序中，可以使用-moz-outline-radius CSS属性可用于来给出元素的outline圆角。

/* One value */
-moz-outline-radius: 25px;

/* Two values */
-moz-outline-radius: 25px 1em;

/* Three values */
-moz-outline-radius: 25px 1em 12%;

/* Four values */
-moz-outline-radius: 25px 1em 12% 4mm;

/* Global values */
-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。

• -moz-outline-radius-topleft：0

• -moz-outline-radius-topright：0

• -moz-outline-radius-bottomright：0

• -moz-outline-radius-bottomleft：0

Applies to all elements   [Inherited](inheritance) no   Percentages as each of the properties of the shorthand:

• -moz-outline-radius-topleft：参考边框的相应尺寸

• -moz-outline-radius-topright：参考边框的相应尺寸

• -moz-outline-radius-bottomright：参考边框的相应尺寸

• -moz-outline-radius-bottomleft：参考边框的相应尺寸

Media visual   [Computed value](computed_value) as each of the properties of the shorthand:

• -moz-outline-radius-topleft：具体规定

• -moz-outline-radius-topright：具体规定

• -moz-outline-radius-bottomright：具体规定

• -moz-outline-radius-bottomleft：具体规定

Animation type as each of the properties of the shorthand:

• -moz-outline-radius-topleft：长度，百分比或calc（）；

• -moz-outline-radius-topright：长度，百分比或calc（）；

• -moz-outline-radius-bottomright：长度，百分比或calc（）；

• -moz-outline-radius-bottomleft：长度，百分比或calc（）；

Canonical order the unique non-ambiguous order defined by the formal grammar  

语法

值

椭圆轮廓border-radius中对<percentage>描述的语法。

一，二，三或四个<outline-radius>值，表示下列之一：

<length>更多可能的值见<length>。<percentage>一个<percentage>；关于更多细节可见border-radius。

• 如果设置了单个值，它可适用于4个角。

• 如果设置了两个值，第一个值适用于左上角和右下角，第二个值适用于右上角和左下角。

• 如果设置了三个值，则第一个适用于左上角，第二个适用于右上角和左下角，第三个适用于右下角。

• 如果设置了四个值，则第一个值适用于左上角，第二个值适用于右上角，第三个值适用于右下角，第四个值适用于左下角。

正式语法

<outline-radius>{1,4} [ / <outline-radius>{1,4} ]?

示例

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;
}

结果

注释

• dotted或dashed弧形角被渲染成实心，错误382721

• 未来版本的Gecko / Firefox可能完全丢弃这个属性。查看错误315209。

规范

这个属性在任何CSS标准中都没有定义。

浏览器兼容性