有没有一种方法可以使用CSS使字体图标看起来更薄/更苗条？

我正在努力使字体的图标看起来更苗条

我尝试使用“-webkit text stroke”，但当鼠标悬停在图标上时，这没有帮助，因为你可以看到背景色，我不希望看到背景色

.accordion-toggle {
  background-color: #777;
  color: white;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;

}

.collapsed, .accordion-toggle:hover {
  background-color: #555;
}

.accordion-toggle:after {
-webkit-text-stroke: 2px #eee; //  Icons thinner not working 
    font-family: 'FontAwesome'; /* essential to enable caret symbol*/
    content: "\f067";
  color: white;
  font-weight: bold;
  float: right;
  margin-left: 5px;
  margin-right: 30px;



}

.collapsed:after {
 content: "\f068";
}

.collapse {
  padding: 0 18px;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
  background-color: #f1f1f1;
}

---

只需删除字体重量：在ur css中加粗，

不，您无法使字体可怕图标看起来更细，但您正在使用的

+

图标已经是字体可怕的默认厚度

您正在应用

font-weight:bold在
中。手风琴切换：在
类之后。使其
font-weight:正常它会将图标更改为正常厚度

通过应用
font-weight:bold，可以增加字体的粗细
但不能使用
字体重量：更轻

谢谢你…
是的，你可以。只需删除字体，并在css内容属性中添加您需要的自定义文本和符号

请尝试下面的CSS

 .accordion-toggle:after {
  /*-webkit-text-stroke: 2px #eee; */ /*remove it*/
  /* font-family: 'FontAwesome'; */ /* remove it*/
   content: "+"; /*change*/
   color: white;
   font-weight: bold; /*remove it or change value according to you*/
   float: right;
   margin-left: 5px;
   margin-right: 30px;
}

 .collapsed:after {
  content: "-";
 }

你说的是字体大小，对吗？你可以用
字体大小来处理这个问题，但这不是一个合适的解决方案，你可以用不同的图标（薄而平滑）来改变你的图标。例如，检查
https://icomoon.io/app/
和不同的图标包您可以使用font-awesome-PRO:），与免费图标相比，它有其他版本的图标，包括
light
version。在此处查看“+”符号，例如：Hi@cornel.raiu事实上，我想要的是字体很棒的专业图标，但它在我的CSS中不起作用。正如你所看到的，我使用了与你共享的链接中提到的相同的unicode，但这并没有使我的图标变薄。有没有办法在CSSHi@Prakash中使用字体很棒的专业图标，我想用字体很棒来做到这一点。谢谢。你好@cliff，好的，太好了。然后，您可以使用FontAwesome5Pro图标（）。。。。。注意-font Asome5 pro需要许可证。如果你同意的话，那么很好，否则你可以用我给你的替代品谢谢：）我们不能在react native中使用这个，对吗？我正在尝试减少加号的厚度。你能看看这个吗？snack.expo.io/@lindapaiste/022490hello@Jnl，请检查-Hi@Mahesh，这只是增加和减少图标的字体大小，但不会使它们看起来更细。你是说文本的厚度？或者“尺寸更细”的意思是？文本的厚度。我正在尝试减少加号的厚度。你能看看这个吗？snack.expo.io/@lindapaiste/022490