Question

我有3个SVG如下所示。我只能改变内联SVG的颜色。有什么想法吗？（IIS上托管的代码）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
    </head>
    <body>
        <object id="objectSvg" type="image/svg+xml" data="eq.svg"></object>
        <svg id="svg" width="100" height="100" viewBox="0 0 300 300">
            <use xlink:href="eq.svg#EarthquakeSymbol"></use>
        </svg>

        <svg id="inline" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="none" x="0px" y="0px" width="300px" height="300px">
            <circle cx="150" cy="150" r="140" stroke="black" stroke-width="20" fill="none"/>
            <path id="mypath"stroke="#000000" stroke-width="20" stroke-linejoin="miter" stroke-linecap="butt" stroke-miterlimit="3" fill="none" d="M 35.5 141.55 L 81.05 141.55 108.75 86.1 150.35 223.05 189.4 132.8 207.95 172.5 222.7 141.65 265.8 141.65"/>
        </svg>
        <script>
            $('#objectSvg path').css({ stroke: "#ff0000" });
            $('#svg path').css({ stroke: "#ff0000" });
            $('#inlineSvg path').css({ stroke: "#ff0000" });</script>
    </body>
</html>

Answer 1

我很确定你不能用css为外部加载的SVG设置样式。为什么不将外部SVG中的代码剪切并粘贴到您的html中，就像其他两个一样？

这是有关使用SVG的信息的绝佳资源：https://css-tricks.com/using-svg/

通过jquery使用外部源更改SVG的颜色

1 个答案: