如何将图像的背景颜色变为透明？

Question

我有一个箭头图像，希望它的背景颜色与默认背景（即浅蓝色）相等。此外，在图像边框周围还有一些白色空间，我想要移除这些空间。我尝试使用不透明度属性来实现这个样式，但效果并不理想。

以下是我的CSS代码：

.rm-section .rm-links .m .rm p:after {
  overflow: hidden;
  border-radius: 150px;
  content: url(/etc/designs/fai/clientlibs/base/images/down_arrow_icon.jpg);
  display: inline-block;
  vertical-align: middle;
padding: 24px;
  margin: 0px;
}

- OSAMA E

---

如果你的图片是这样的自然状态，那么你无法通过CSS进行修改，你需要在将其添加到HTML/CSS之前使用图像编辑器进行编辑。（另外，.jpg格式不支持透明度） - Calvin Nunes

是的，图像从一开始就是这样的。 - OSAMA E

我使用了不透明度，看起来它正在工作...但是可能我的HTML与你的不同？请查看下面的fiddle链接并告诉我们 :) https://jsfiddle.net/bvd4m8qj/2/ - lampropoi

不透明度使图像过于模糊。 - OSAMA E

此外，您可以使用免费的在线库，其中包含像这样带有图像的字体（Font Awesome 是一个很好的例子）。 - Hazel へいぜる

Answer 1

按照以下步骤进行操作即可，非常简单：

1. 在以下网站在线制作背景图片：链接

2. 下载PNG格式的图片

3. 不要在CSS中设置图像的背景

示例图片请参见“下一个”和“返回”按钮：链接

- Wassim Al Ahmad

---

嘿，你可能不小心删除了第一个燃烧器链接。 - Rohith Balaji

是的，链接不同。 - OSAMA E

抱歉，我会修复它。 - Wassim Al Ahmad