css - React 图标 - 更改背景颜色

Question

目前在网站上使用 react-icons 并且在 svg 和样式方面遇到问题。

到目前为止，我尝试的是使用{IconContext.Provider}git repo 上显示的 React-Icons 以及使用fill, stroke。我还尝试使用上下文提供程序添加一个 CSS 类，然后在模块中使用 CSS 属性设置 svg 的背景颜色，但这似乎也不起作用。

设置 SVG 背景颜色的最简单方法是什么？

使用中风和填充它只会为实际图标本身着色，因为那是正在绘制的矢量。

Icon正在作为道具传递给StyledCard.

 <StyledCard
     heading="Express"
     techIcon={<FaAngleDoubleRight color="#808080" size={80} stroke="black" strokeWidth=".3"/>} />

score 0 · Accepted Answer

使用currentColor内部笔划，它将被父颜色替换。

例子：

<StyledCard
     heading="Express"
     techIcon={<FaAngleDoubleRight size={80} stroke="currentColor" strokeWidth=".3"/>} 
/>

1 回答 1