是否可以在元素之前添加SVG:：并访问笔划和填充？

是否可以像这样在CSS中添加before元素：

    ul {
        li:before {
            content: url('../icons/fancy-symbol.svg');
        }
    }

并且可以访问svg的对象（例如特定的线或矩形）和属性（例如笔划宽度、笔划和填充颜色）

或者对于这种情况是否有解决办法

---

用例是在悬停时给一些线上色，并在单击时为svg设置动画。

您可以在svg URL上指定一个片段，如

。/icons/fancy symbol.svg#red

，然后让文件中的CSS对此做出反应：

<style>
  #red:target ~ .some-element-here {
    fill: red;
  }
</style>

---

（顺便说一句，使用

ul{list style image:url（…）}

而不是伪元素可能更容易。）

在这种情况下，SVG的属性和属性将无法从外部修改。这不是SVG实现中的一个巨大缺陷吗？是否计划访问这些元素？不，这是对您隐私的巨大保护。因此，将永远不允许访问元素。

.li:before {
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' 
  fill='#{$color}'%3E...");
}