【问题标题】:Mozilla not detecting CSS -moz-border-radiusMozilla 未检测到 CSS -moz-border-radius
【发布时间】:2012-10-05 12:11:53
【问题描述】:

我在 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 不支持渐变,我不得不使用过滤器,它将我可爱的弯曲角落恢复为正方形.我可以把它们都做成正方形,但我喜欢圆角的外观,如果我能保存它们,我会更喜欢。提前致谢。

【问题讨论】:

    标签: css


    【解决方案1】:

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

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

    是的,it is gone as of Firefox 13

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

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

    【讨论】:

    • 抱歉回复晚了。感谢您的回答,但我太固执了,无法使用图像!不是真的,这是一个 css3 的测试站点,但目前似乎没有解决方法,只使用 css3,目前跨浏览器。感谢您提供其他解决方法!
    【解决方案2】:
    border-radius:10px;
    -moz-border-radius:10px;
    

    在你的 CSS 中添加边框半径

    【讨论】:

    • 我认为 -moz- 已被删除。它无法识别它,并且该标准适用于 IE 和 Mozilla,我不希望这样做,因为即使我使用边框半径,IE 上的颜色过滤器也会出现方形。
    • 是的,但是-moz- 可能对旧版本的 Firefox 有用,没有它不支持 border-radius 属性。最好两者都保留。
    【解决方案3】:

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

    【讨论】:

      猜你喜欢
      • 2011-04-27
      • 1970-01-01
      • 2010-12-09
      • 1970-01-01
      • 1970-01-01
      • 2010-11-23
      • 2014-02-03
      • 1970-01-01
      • 2022-01-25
      相关资源
      最近更新 更多