使divs不透明度像线性渐变一样变化

Question

我希望div的不透明度在http://<the ip of your Mac on local network>:8080中像0.0.0.0一样在左，上，右或下方向减小，但只是为了整个外观（而不仅仅是背景） ）。有什么办法吗？

我尝试使用以下代码进行操作：

html

linear-gradient

css

background-image

正如预期的那样，它可以很好地与颜色配合使用，但是现在我想插入图像作为身体的背景，显然它不能像这样工作，你们中的任何一个会怎么做？

编辑：
您中有些人将其标记为css gradient opacity slide image left to right color white的副本，但这并不相同；
我不是在谈论制作{{ 1}}在它上面得到线性渐变，我说的是使整个div的一部分像渐变一样消失。

Answer 1

使用口罩：

.mask {
  -webkit-mask-image: linear-gradient(to left, transparent 30%, black 100%);
  mask-image: linear-gradient(to left, transparent 30%, black 100%);
}