我可以用CSS更改svgpath的填充颜色吗？
我有以下代码：
<span> <svg height="32" version="1.1" width="32" xmlns="http://www.w3.org/2000/svg" style="overflow: hidden; position: relative; left: -0.0166626px; top: -0.983337px;"> <desc></desc> <defs/> <path style="" fill="#333333" stroke="none" d="M15.985,5.972C8.422,5.972,2.289999999999999,10.049,2.289999999999999,15.078C2.289999999999999,17.955,4.302999999999999...............1,27.68,22.274Z"/> </svg> </span> 是否有可能用CSS或其他方式改变SVGpath的填充颜色，而不实际改变它在path标记内？
是的，您可以将CSS应用到SVG，但是您需要匹配元素，就像样式化HTML时一样。 如果您只是想将其应用于所有SVGpath，则可以使用，例如：
path { fill: blue; }
外部CSS似乎覆盖path的fill属性，至less在我testing的基于WebKit和Gecko的浏览器中。 当然，如果你写了<path style="fill: green">那么也会覆盖外部的CSS。
如果你想通过hover在元素中来改变颜色，试试这个：
path:hover{ fill:red; }
我遇到了一个惊人的资源上的CSS技巧： https ： //css-tricks.com/using-svg/
那里解释了一些解决scheme。
我更喜欢那些需要对源代码进行最less编辑的程序，也不需要将它embedded到html文件中。 该选项使用<object>标签。
使用<object>将svg文件添加到您的html中; 我还声明了HTML属性的width和height 。 使用这些宽度和高度的svg文件不会缩放，我在附近的svg css文件中使用一个css transform: scale(...)语句来处理svg标签。
<object type="image/svg+xml" data="myfile.svg" width="64" height="64"></object>
创build一个CSS文件附加到您的SVN文件。 我的源svgpath被缩放到16px，我把它放大到64倍，为四倍。 它只有一个path，所以我不需要更具体地select它，但path有一个fill属性，所以我不得不使用!IMPORTANT是强制css先例。
#svg2 { width: 64px; height: 64px; transform: scale(4); } path { fill: #333 !IMPORTANT; }
在打开<svg标签之前编辑你的目标svg文件，以包含样式表; 请注意，href是相对于svg文件的url。
<?xml-stylesheet type="text/css" href="myfile.css" ?>
如果您进入SVG文件的源代码，您可以通过修改填充属性来更改颜色填充。
<svg fill="#3F6078" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> </svg>
使用你最喜欢的文本编辑器，打开SVG文件，并玩它。
你把这个CSS为svg圈。
svg:hover circle{ fill: #F6831D; stroke-dashoffset: 0; stroke-dasharray: 700; stroke-width: 2; }
