javascript - CSS Url 将图像显示为纯色

Question

我尝试.png通过 CSS 导入文件url()，但按钮最终是图像中的纯色，而不是图像本身。我尝试了不同的图像，它只是加载了不同的纯色。

导航栏应该是纯色的，角落里有按钮，但它会受到周围元素模糊的影响。我尝试弄乱z-index，但这并没有改变任何东西。我尝试消除模糊，它修复了模糊渐变，但这对我来说不是问题，.png仍然无法正确加载。

我仍在尝试使用 CSS，这很可能是因为在不了解 CSS 核心的情况下混合了不同的教程，但我想了解它们为什么会发生冲突。

链接到我的 CodeSandbox 示例

标签： javascripthtmlcssreactjs

Answer 1

在尝试了这么多事情之后，我随机尝试了调整大小background-size: 100%并得到了我想要的结果。