Question

我有一个图标文件夹，我存储了所有SVG图标和艺术品。由于这是我第一次使用svg图标，我尝试通过图像标记和'i'标记使用它们。即使我认为我能够改变图标的尺寸，我真的想改变图标的颜色，这似乎不适用于CSS。

这是我的svg文件

<?xml version="1.0" encoding="utf-8" ?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" []>
<svg version="1.1" id="Layer_1" xmlns:x="&ns_extend;" xmlns:i="&ns_ai;" xmlns:graph="&ns_graphs;" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="48px" height="48px" viewBox="0 0 48 48" enable-background="new 0 0 48 48"
xml:space="preserve">
  <switch>
    <foreignObject requiredExtensions="&ns_ai;" x="0" y="0" width="1" height="1">
      <i:pgfRef xlink:href="#adobe_illustrator_pgf">
      </i:pgfRef>
    </foreignObject>
    <g i:extraneous="self">
      <g>
        <path fill="#007AFF" d="M22,8.9C14..." />
        <path fill="#007AFF" d="M22,0.5..." />
      </g>

    </g>
  </switch>
</svg>

这是我的html文件

 <div>    
   <img src="icons/coin_filled.svg" id="coin-filled"></img>
   <img src="icons/coin_filled.svg"></img>
 </div>

我需要经常更改图标的颜色。我如何在html中使用svg图标，如何通过CSS设置它们？

通过CSS设置svg图标

0 个答案: