css 将类应用于div中的svg

wfauudbj 于 2023-05-02 发布在其他

关注(0)|答案(2)|浏览(154)

我的代码如下所示。但是，没有任何内容应用于svg。解决这个问题的最好办法是什么？

.icon {
    width: 250px;
    height: 250px;
    background-color: chartreuse;
}

.icon > svg {
    fill: brown;
    width: 100%;
    height: 100%;
}

2条答案

从svg中删除内联样式fill="none"、width="37"和height="36"。

我使用的技巧是给予父元素一个color属性，在本例中是.icon，并将svg css设置为fill: currentColor

.icon {
  color: brown;
  /* Rest of your code */
}

.icon > svg {
  fill: currentColor;
  /* Rest of your code */
}

更多详情here