CSS 类中给出的图像 url 不起作用答案

【问题标题】：Image url given in CSS class is not workingCSS 类中给出的图像 url 不起作用
【发布时间】：2021-01-11 15:35:18
【问题描述】：

我有一个带有图像 url 的 css 类，路径是正确的，因为在 Chrome 中的检查模式下我可以看到该类已加载图像，但在 <img /> 元素中图像未显示。仅当我将图像路径放在其src 属性中时它才有效。

在屏幕截图中，红色标记区域是我尝试使用该类但无法正常工作的位置，绿色标记区域是我将图像路径直接放入src 属性并使其工作的位置。

我在 CSS 中尝试了 background 和 background-image 属性，但没有一个起作用。现在我可以通过使用 src 属性而不是 css 类来解决它，但我的问题是为什么图像在使用 css 类传递时无法呈现？

【问题讨论】：

【解决方案1】：

如果我是正确的，你在img 标签上使用background-image。这不是最佳实践，也不是此样式规则的目的。你可以使用div 而不是img 来代替background-image。

【讨论】：

谢谢，实际上我试图直接使用“背景图像”作为内联样式来查看它是否工作，因为使用类不是。我只是在测试它，如果你再看一遍，你可以看到样式被注释掉了。我只是在 Chrome 中使用开发工具来查看是否可以使用 css 来渲染该图像。

【解决方案2】：

在我看来，它工作正常。我们可以在背景中看到计算器图像。您的问题是您的 <img> 没有 src 属性（因此图标带有损坏的图像）。

【讨论】：