html - 保持图像的透明背景？

Question

我是 html 和 css 的新手。我们为 AIT 分配的任务是编写一个网站代码，但是我现在遇到了困难。基本上，我希望网站的徽标“Daft Punk”位于网站的中心，以保持其透明背景：

使用代码：

.logo1 {
  margin-left: auto;
  margin-right: auto;
  display: flex;
  z-index: 2;
  position: absolute;
  text-align: center;
  transform: translate(0, 5%);
  vertical-align: middle;
  align-items: center;
  justify-content: center;
}

然而，我遇到的问题是，每当我向外滚动时，图像往往保持不变（我希望它根据缩放缩小）并最终突然向页面左侧移动。保持的大小可能是由于“位置：绝对”，但是每当我将其更改为其他内容时，图像的背景就会突然变白：

当我将位置：# 更改为“相对”等其他任何内容时，我该如何做到这一点，以便当我缩小时，中心的内容/徽标也会缩小/缩小并同时保持在中心不丢失其透明背景？

标签： htmlcss