我已经成功地在其他浏览器中基于样式名在SVGs中使用了clip path，但是当从外部样式表在Firefox中使用'clip path'CSS属性时，它没有任何效果。
Example of it working in a jsfiddle
下面的代码在Firefox上不起作用，但是如果你在标题中的<style>标记之间放置相同的css，它会！
<!doctype html>
<html lang="en">
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div class='svgWrapper' style='float:left; border:1px solid black; line-height:0px;'>
<svg width="200" height="200" viewPort="0 0 200 200" version="1.1" xmlns="http://www.w3.org/2000/svg">
<defs>
<clipPath id="myClip">
<circle cx="100" cy="100" r="100"/>
</clipPath>
</defs>
<rect class="foo" fill="DeepSkyBlue" x="0" y="0" width="200" height="200" />
</svg>
</div>
</body>
</html>
其中“style.css”包含
.foo{
clip-path: url(#myClip);
}
这是一个具有现有基础设施的大型项目的一部分，我不能简单地内嵌样式或内部样式表，但我需要在Firefox中工作。任何帮助都将不胜感激。
最佳答案
在style.css中：
.foo {
clip-path: url(pagename.html#myClip);
}
关于html - 如何在Firefox中获得外部链接的SVG剪切路径，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/35287284/