用css样式修改svg图标颜色

主要是利用css滤镜的投影drop-shadow来实现，方法是将原svg移动到网页看不见的地方，然后对原svg投影到原位置，影子实心不虚散，对影子进行颜色控制。

css:

        :root {
            --color: #7a65ee; /* 站点主题颜色 */
            --svg-offset: 20000px; /* 将原svg移出窗口较远的位置 */
        }

        .icon {
            width:16px;height:16px;
            position: relative;
            left: calc(var(--svg-offset) * -1);
            filter: drop-shadow(var(--color) var(--svg-offset) 0);
        }
        .icon:hover {
            filter: drop-shadow(white var(--svg-offset) 0);
        }

html:

<div>
    <img src="./svg/back.svg" class="icon"/> 返回
</div>