SVG 图标颜色调整

（1）通过CSS修改SVG元素填充颜色

SVG使用CSS的fill属性来填充元素的颜色。通过定义CSS规则，可以轻松地修改SVG图形的颜色。

 svg {
            fill: red;
        }

2、使用CSS修改SVG元素描边颜色

SVG使用stroke属性来定义和修改图形元素的描边颜色。

  svg {
      stroke: blue;
      stroke-width: 3px;
  }

3、在 SVG 代码中直接修改

使用fill属性可以修改SVG形状的填充颜色，使用stroke属性可以修改SVG形状的描边颜色。

<svg width="100" height="100">
  <rect x="10" y="10" width="80" height="80" fill="#ff0000" />
</svg>

SVG 中也可以使用 css 样式：

<svg width="100" height="100">
  <style>
    #shape1 { fill: green; }
    #shape2 { fill: red; }
  </style>
  <rect x="10" y="10" width="30" height="30" id="shape1" />
  <rect x="60" y="10" width="30" height="30" id="shape2" />
</svg>