Html 如何更改此SVG的颜色？

我正在尝试使用CSS更改此SVG图标的颜色：

<symbol id="meetings">
  <svg viewBox="9 0 33 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
      <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" transform="translate(10.000000, 0.000000)">
          <polygon id="Fill-1" points="0.484430769 31.5076923 31.9921231 31.5076923 31.9921231 0 0.484430769 0"></polygon>
          <g id="Group-4" transform="translate(0.000000, 5.907692)">
              <path d="M4.92209231,11.8248862 C4.31409231,11.8248862 2.46006154,10.3154708 2.46006154,6.70390154 C2.46006154,2.47251692 4.8896,0.00704 7.79470769,0.00704 C9.18498462,0.00704 9.83926154,0.0715323077 10.5846154,0.745993846 C12.7123692,0.745993846 14.7702154,2.32433231 14.7702154,6.70390154 C14.7702154,10.2869169 12.9353846,11.8248862 12.3081846,11.8248862 C12.0900923,11.8248862 11.9241846,11.6338708 11.6795077,11.3847631 C11.4304,11.6328862 11.1547077,11.8539323 10.8583385,12.0439631 C10.9883077,13.9743015 11.7257846,14.7536246 13.8594462,15.5452554 C16.0896,16.3728246 17.1037538,16.9429169 17.2332308,19.1730708 C17.2494769,19.4477785 17.0402462,19.6831015 16.7655385,19.6993477 C16.7566769,19.69984 16.7483077,19.69984 16.7394462,19.69984 L0.494769231,19.69984 C0.219569231,19.6983631 -0.00147692308,19.4738708 2.03980422e-13,19.1991631 C2.03980422e-13,19.1903015 0.000492307693,19.1819323 0.000984615385,19.1730708 C0.130953846,16.9429169 1.14461538,16.3728246 3.37526154,15.5452554 C5.50793846,14.7541169 6.24541538,13.9747938 6.37538462,12.0464246 C6.07606154,11.8549169 5.79790769,11.6319015 5.54633846,11.3808246 C5.29969231,11.6314092 5.13476923,11.8248862 4.92209231,11.8248862 M31.0129231,19.69984 L18.6973538,19.6983631 C18.4369231,19.6993477 18.2212923,19.4960246 18.2070154,19.2355938 C18.2178462,18.26624 17.9244308,17.3180554 17.3671385,16.5244554 C17.1515077,16.2615631 17.1899077,15.8736246 17.4532923,15.6579938 C17.5035077,15.61664 17.5606154,15.5831631 17.6216615,15.5600246 L17.6605538,15.5452554 C19.7971692,14.7516554 20.5326769,13.9703631 20.6596923,12.0301785 C20.2904615,11.7933785 19.9571692,11.5053785 19.6696615,11.1745477 C19.1537231,10.5055015 18.8292923,9.70944 18.7308308,8.87054769 C18.7067077,8.87300923 18.6825846,8.87497846 18.6589538,8.87497846 C18.1243077,8.87497846 17.7196308,7.74759385 17.7196308,6.95497846 C17.7196308,6.16236308 17.9943385,5.92113231 18.2562462,5.92113231 C18.3108923,5.92113231 18.3616,5.92408615 18.4108308,5.92802462 C18.2872615,5.43030154 18.2217846,4.92027077 18.2153846,4.40777846 C18.2153846,2.48580923 18.7544615,1.15559385 20.4007385,0.918793846 C21.312,0.286670769 22.6894769,0.00753230769 24.4494769,0.00753230769 C25.5748923,0.00753230769 24.6370462,0.777501538 25.6950154,1.00248615 C26.3497846,1.14180923 27.5687385,1.60556308 27.5687385,4.40777846 C27.5623385,4.92027077 27.4968615,5.43030154 27.3732923,5.92802462 C27.4220308,5.92408615 27.4732308,5.92113231 27.5278769,5.92113231 C27.7902769,5.92113231 28.0644923,6.16236308 28.0644923,6.95497846 C28.0644923,7.74759385 27.6603077,8.87497846 27.1256615,8.87497846 C27.1015385,8.87497846 27.0774154,8.87300923 27.0532923,8.87054769 C26.9548308,9.70944 26.6304,10.5055015 26.1144615,11.1745477 C25.8299077,11.5019323 25.5005538,11.7874708 25.1357538,12.0227938 C25.2612923,13.9688862 25.9958154,14.7511631 28.1353846,15.5452554 C30.3635692,16.3728246 31.3767385,16.9429169 31.5062154,19.1730708 C31.5224615,19.4472862 31.3137231,19.6831015 31.0395077,19.6993477 C31.0306462,19.69984 31.0217846,19.69984 31.0129231,19.69984" id="Fill-2"></path>
          </g>
      </g>
  </svg>

这不管用，我也不知道为什么。当我尝试从

g

标记（

fill=“#03A9F4”

）中删除填充声明时，SVG将完全消失

活动类甚至会显示在开发工具中，但颜色不会显示为白色

---

更新：这似乎是

标签的问题。如果我将该类直接放在SVG上，那么它将按预期工作。仍然不确定这里发生了什么。

当您通过

引用某个内容时，引用的元素不会突然成为

元素下“DOM”的一部分。换句话说，DOM仍然是这样

<symbol id="meetings">
   <path>
<svg class="active">
   <use>

如果要动态设置符号样式，则可以使用一种有限的解决方案。SVG颜色有一个名为

currentColor

的特殊关键字值，允许您将

color

的当前值用于填充或笔划

这个“把戏”允许我们将单一颜色传递到符号中。在下面的示例中，我使用它为符号中的路径着色

#第4组{
填充：当前颜色；
}
svg.active{
颜色：红色；
}
svg.inactive{
颜色：浅灰色；
}

---

当您通过

引用某个对象时，被引用的元素不会突然成为

元素下“DOM”的一部分。换句话说，DOM仍然是这样

<symbol id="meetings">
   <path>
<svg class="active">
   <use>

如果要动态设置符号样式，则可以使用一种有限的解决方案。SVG颜色有一个名为

currentColor

的特殊关键字值，允许您将

color

的当前值用于填充或笔划

这个“把戏”允许我们将单一颜色传递到符号中。在下面的示例中，我使用它为符号中的路径着色

#第4组{
填充：当前颜色；
}
svg.active{
颜色：红色；
}
svg.inactive{
颜色：浅灰色；
}

尝试改为想要的值或删除？@DaniSpringer我不能，该活动类是动态添加的，因此当该类不存在时，SVG需要是

#03A9F4

“需要”，该

标记将在哪里？您可以在前后打勾。像
这个
谢谢，我更新了注释，尝试改为想要的值或删除？@DaniSpringer我不能，那个活动类是动态添加的，所以当那个类不存在时，SVG需要是
#03A9F4
“需要”，这个
标记在哪里？你可以在前后打勾。像
这个
谢谢我更新了那条评论
<symbol id="meetings">
   <path>
<svg class="active">
   <use>

<svg class="active">
   <use>
      <symbol id="meetings">
         <path>

#Group-4 {
  fill: #ffffff;
}