css - 前景中的 Transparent-Background-Png 不保留 Angular 组件中的背景透明度

Question

所以基本上我正在创建一个登陆页面，我想使用这张漂亮的云图片，透明背景覆盖在一个漂亮的风景之上，这样他们就可以向上滚动。
问题是当我将图像（确实具有透明背景）放入应用程序时，它没有透明背景。
这是它的样子：

html:

<img src="assets/img/tryClouds.png" alt="Clouds" class="clouds">

scss:

.clouds{
      position:absolute;

      background:transparent;
      width:100%;
      height:30vh;
      top:35vh;
      z-index:24;

  }

任何有效的帮助都会让我成为你一生中最大的粉丝！！:D <333333333 我会欠你一辈子债，Zaalbar KOTOR 风格。

标签： cssangularangularjspngtransparent

Answer 1

答：找到了。
工具：带有 .ebs 文件的 Adob​​e Illustrator。
实际问题：与 css、js 或 angular 无关

• 一些声称“透明”背景的文件实际上具有模仿透明背景的棋盘背景。这些文件是从我支付每月订阅费使用的库存图像供应商处下载的。我想出了如何利用这些让我困惑和欺骗我的优秀图像！
  

解析度：

• 使用 adobe illustrator（我知道，要花钱，但这种事情的好工具，可能是我读过的唯一选择）
  
• 在 illustrator 中打开 .ebs（矢量）照片。
  
• 现在我错了。我会“导出为”，选择 png，然后选择“透明”作为背景。
  
• 问题是图像本身实际上渗透了这个冒名顶替的棋盘格。D:<
  
• 现在，基本上不可能选择和删除这个冒名顶替者（ |:< ）“透明”背景的每一块，就像云一样飘渺！
  
• 值得庆幸的是，如果它是一个高质量的矢量，背景将包含在一个图层中。
  
  
• 单击背景图层，然后单击屏幕截图中圈出的右上角按钮，然后选择“删除”。
  
  
• 现在你太棒了 2 去*puts sunglasses on*;)