如何在web里,将svg图标从黑色改成白色?

我下载了一大堆svg图标,都是黑色的,也不想再重新下载了,需要把他们改成白色填充。
我一开始是尝试

svg > path {
  fill: white;
  color: white;
}

在浏览器inspector发现,整个方块变白了。
原因似乎是,每个svg除了图案本身path,还有一个外框path。我从各个icon站点下载下来的都是这样,

正确的修改方式是什么?
若是多彩svg图标,这种情况要怎么特殊处理?

回答不易,求求您采纳点赞哦

一种方法是使用 CSS 设置颜色:

svg path {
  fill: white;
}

如果是多彩的 SVG 图标,可以通过在 CSS 中指定特定 path 的颜色进行控制:

svg path.icon-part-1 {
  fill: white;
}

svg path.icon-part-2 {
  fill: red;
}

在 SVG 代码中,需要添加 class 属性:

<svg>
  <path class="icon-part-1" ... />
  <path class="icon-part-2" ... />
</svg>