firefox img圆角边框而不使用div背景

时间:2010-10-28 19:41:43

标签: firefox css3 rounded-corners

这是一个已知的错误,-moz-border-radius对firefox中的图像不起作用。有什么方法可以获得此功能而无需将图像作为背景放在圆角div上?

1 个答案:

答案 0 :(得分:1)

在当前的Firefox you can use SVG filters中。像这样有一个SVG文件clip.svg

<svg:svg height="0">
    <svg:clipPath id="c1" clipPathUnits="objectBoundingBox">
        <svg:rect x="0" y="0" rx="0.05" ry="0.05" width="1" height="1"/>
    </svg:clipPath>
</svg:svg>

并在CSS中应用它:

.target { clip-path: url(clip.svg#c1); }