开发者

firefox img rounded borders without using div background

开发者 https://www.devze.com 2023-01-23 01:17 出处:网络
It\'s a known bug that -moz-border-radius doesnt work on images in firefox. What\'s a way to get this functionality without resorting to putting the ima开发者_如何学Goge as a background on a rounded d

It's a known bug that -moz-border-radius doesnt work on images in firefox. What's a way to get this functionality without resorting to putting the ima开发者_如何学Goge as a background on a rounded div?


In current Firefox you can use SVG filters. Have an SVG file clip.svg like this:

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

And apply it in CSS like this:

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

精彩评论

暂无评论...
验证码 换一张
取 消