1

我在 Mozilla 检测 -moz-border-radius 时遇到问题。它默认为正常的边界半径，如果我删除它，它只会在边缘再次变回方形。

     -webkit-border-top-right-radius: 15px;
 -webkit-border-top-left-radius: 3px;
 -webkit-border-bottom-left-radius: 15px;
 -webkit-border-bottom-right-radius: 3px;
 -moz-border-radius-topright: 15px;
 -moz-border-radius-topleft: 3px;
 -moz-border-radius-bottomleft: 15px;
 -moz-border-radius-bottomright: 3px;
 border-top-right-radius: 15px;
 border-top-left-radius: 3px;
 border-bottom-left-radius: 15px;
 border-bottom-right-radius: 3px;

我听说 Mozilla 已经放弃了边界半径的 -moz- ，有人可以证实这一点吗？我正在使用此代码为网站制作按钮，但在跨浏览器工作时遇到问题。

    /* BACKGROUND GRADIENTS */
 background: #A2C838;
 background: -moz-linear-gradient(top, #A2C838, #92B432 50%, #82A02D 51%, #718C27);
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #A2C838), color-stop(.5, #92B432), color-stop(.5, #82A02D), to(#718C27));
 filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#A2C838', EndColorStr='#718C27'); /* IE6,IE7 */
 -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#A2C838', EndColorStr='#718C27')"; /* IE8 */

问题是我不能真正使用边框半径，因为它现在似乎会影响 mozilla 和 IE，但由于 IE 不支持渐变，我不得不使用过滤器，它将我可爱的弯曲角恢复为正方形。我可以把它们都做成正方形，但我喜欢圆角的外观，如果我能保存它们，我会更喜欢。提前致谢。

4

3 回答 3

1

如果您在 IE 中需要圆角，您可以使用预渲染的渐变图像作为背景而不是滤镜，或者尝试应用border-radius到容器元素并使用overflow: hidden来查看渐变滤镜是否被容器边框剪裁。

我听说 Mozilla 已经放弃了边界半径的 -moz- ，有人可以证实这一点吗？

是的，它从 Firefox 13 开始就消失了。

当同一个属性的标准版本已经被很好地实现了这么长时间时，支持非标准属性真的没有意义。在任何情况下都没有理由使用非标准前缀版本而不是标准无前缀版本，因为供应商前缀的全部目的是提供可能最终成为标准或可能不会成为标准的实验性实现。您不能依赖那些始终存在的非标准属性。

IE 过滤器将始终忽略border-radius，这是设计使然。但仅仅因为一个浏览器以非标准方式做某事并不意味着您必须对其他所有浏览器都非标准。此外，由于 IE 无论如何都会消除角落，因此border-radius在代码中保留无前缀确实没有害处。

于 2012-10-05T12:19:24.057 回答
0 
border-radius:10px;
-moz-border-radius:10px;

在你的 CSS 中添加边框半径

于 2012-10-05T12:17:00.590 回答
0

您可以使用PIE.HTC - Progressive Internet Explorer HTML Component在 IE 中同时拥有边界半径和线性渐变。所以不需要使用微软过滤器。

于 2013-02-22T12:14:36.017 回答