如何擦除图像的透明部分[关闭]答案

【问题标题】：How to erase the transparent part of the image [closed]如何擦除图像的透明部分[关闭]
【发布时间】：2020-09-06 14:54:40
【问题描述】：

我想在我的网站中添加这张图片，但它看起来像这样。

enter image description here

如您所见，这张图片是透明的，但您可以在背景中看到灰色和白色的框。

如何删除背景框？

这是我的代码。

.first-cloud{
  width: 10%;
  height: 10%;
  position:relative;
  left: 60%;
}

  &lt;img class="first-cloud" src="https://e7.pngegg.com/pngimages/508/582/png-clipart-cloud-computing-drawing-cartoon-cloud-white-cloud-love-white.png" alt="cloud"&gt;

【问题讨论】：

图像不透明。它只是有一个正方形的背景。
图像绝对不透明。最好的办法是编辑它并删除背景。
您的图片没有透明背景。
不要从剪贴画网站热链接图像。只需下载它们并将它们包含在您自己的网站中即可。

标签： html css transparency

【解决方案1】：

正如其他人已经指出的那样，您使用的图像不是透明的。

这是来自您 hotlinking 的网站的一项安全措施。如果您继续从网站下载图像，您将获得透明版本。

要下载图像，请按以下步骤操作：

转到此链接：https://www.pngegg.com/en/png-bzgkn
按下“免费下载 PNG”的绿色按钮
将其保存到您的计算机上

【讨论】：

如果他们只是从该剪贴画网站下载剪贴画而不是对其进行热链接，那么它会是透明的。
这是真的@Nyerguds。将我的答案改为包含下载该特定图像的说明。顺便说一句，你的回答很好。

【解决方案2】：

要使图像具有透明背景，请下载免费程序 Gimp2（替代 Photoshop）并按照网络上的教程之一创建透明背景。

请注意，.jpg 文件不能有透明背景 - 您必须将文件重新保存为 .png 或 .webp 文件格式。

来自 Thomas Cokelaer 2016 年的博文：

创建透明背景：

在 Gimp2 中打开您的图像。
选择要透明的区域。从“工具”窗口或“选择工具”窗口上的“选择工具”菜单中选择适当的选择工具。我通常使用魔术棒/模糊选择（选择连续区域）工具或按颜色选择区域工具。单击要选择的区域。使用 shift-click 添加更多区域/颜色。提示：如果您放大（查看 - 缩放菜单）以查看您正在选择的确切内容的详细信息，会更容易。
在“图层”窗口（显示您的图像的窗口）中，选择“图层”-“透明度”-“添加 Alpha 通道”。如果此选项为空白，则说明已完成。这样可以确保您的图片可以存储透明度数据
选择编辑 - 清除。这使选择变得透明。
保存文件。注意：如果将其保存为 PNG 文件，请务必在“另存为 PNG”对话框中选择“保存来自透明像素的颜色值”选项。

参考资料：

http://thomas-cokelaer.info/blog/2016/09/gimp-how-to-make-a-transparent-background/

https://www.guidingtech.com/image-background-transparent-gimp/

【讨论】：

如果他们只是从该剪贴画网站下载剪贴画而不是对其进行热链接，那么它会是透明的。