如何更改 svg 菜单图标的颜色答案

【问题标题】：How to change the color of an svg menu icon如何更改 svg 菜单图标的颜色
【发布时间】：2023-04-02 02:20:02
【问题描述】：

我看到以下代码作为WhatsApp网站中使用的菜单图标：

<svg version="1.1" id="icon-menu" xmlns="http://www.w3.org/1999/xlink" x="0" y="0" width="37" height="37"
             viewBox="0 0 37 37" style="enable-background:new 0 0 37 37;" space="preserve">
            <path class="_2y-e" d="M8,26h21v-1.8H8V26z M8,11v1.8h21V11H8z
                M8,19.2h21v-1.8H8V19.2z"></path>
        </svg>

但是，它是白色的（更改窗口的大小直到出现），但是当我在我的 html 文件中使用它时，它是黑色的，并且更改样式颜色不会改变它的颜色。我怎样才能让它变成白色？

【问题讨论】：

标签： html css svg colors

【解决方案1】：

使用fill 作为图标的样式。

<svg style="fill: white" version="1.1" id="icon-menu" xmlns="http://www.w3.org/1999/xlink" x="0" y="0" width="37" height="37"
             viewBox="0 0 37 37" style="enable-background:new 0 0 37 37;" space="preserve">
            <path class="_2y-e" d="M8,26h21v-1.8H8V26z M8,11v1.8h21V11H8z
                M8,19.2h21v-1.8H8V19.2z"></path>
        </svg>

【讨论】：