在 CSS 中设置蚂蚁设计图标的粗细

时间:2020-12-27 14:36:38

标签: css reactjs ant-design-pro

Attached Image of icon to set the thickness

我尝试在 css 中使用 stroke 和 stroke-width 设置圆的厚度,但它们都不起作用。图标是从 antdesign 导入的。 任何人都可以帮助解决这个问题?非常感激。谢谢

目前我的代码看起来像这样(React)

<PlusCircleOutlined
    style={{
         fontSize: "50px",
         color: "#408021",
         storke: "#408021",
         strokeWidth: "2px",
        }}
 />
enter code here

3 个答案:

答案 0 :(得分:1)

你有一个拼写错误“storke”,应该是“stroke”,但这不是问题。要使线条更粗,您需要使用 stroke 属性等于 white 或等于背景颜色来擦除部分填充区域:

  <PlusCircleOutlined  style={{
        fontSize: "50px",
         color: "#408021",
         strokeWidth: "30", // --> higher value === more thickness the filled area
         stroke: "white" 
  }}/>

答案 1 :(得分:0)

您好像打错了:storke: "#408021"。将其更新为 stroke,它应该可以工作。

答案 2 :(得分:0)

我总是喜欢在 css 中保留我的样式,所以我做到了:

-在我的 jsx 中:

<PlusCircleOutlined className="icon-bold" />

-以我的风格:

.icon-bold {
  stroke-width: 25;
  stroke: black;
  color: black;
}