视差滚动不显示全尺寸图像

Question

我尝试使用 css 创建视差图像。我已经创建了它，但图像未显示完整的 div。我的意思是背景尺寸不包括在内。我怎样才能做到完整？

例如，当我应用此方法时，图像显示完整的 div。

<link href='https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.2.19/tailwind.min.css' rel='stylesheet'/>  

<div class="bg-center bg-no-repeat bg-cover w-full h-80" style="background-image: url(https://img.freepik.com/premium-photo/creative-idea-with-brain-light-bulb-illustration-generative-ai_438099-13380.jpg)">
</div>

但是当我添加

bg-fixed

（背景位置：固定；）时，图像会调整大小并且不显示完整的 div。

就这样

如何显示带有视差的完整 div 图像（无 JS）

Answer 1

使用背景大小：100% 100%，而不是使用背景大小：覆盖。 图像会扭曲，但会占据 100% 的 div。