使用 css 替换图像（在 <img /> 标签中）

Question

我有以下 html：

 <div class="A">
    <img src="image1.png" width="100px" height="100px"/>
</div>

在我的媒体查询 css 样式表中，我想用另一个图像 (image2.png) 替换该图像。

我需要编写什么 css 代码？

我尝试了以下内容：

 .A img
{
   background:url("image2.png") no-repeat;
}

但这似乎不正确？

原文由 Ctea Ctea 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您不能在 CSS 中修改它，而是使用这样的 div：

 <div id='#theImage'></div>

然后在 CSS 中：

 #theImage {
    width:100px;
    height:100px;
    background:url("image1.png") no-repeat;
}

然后您可以使用媒体查询重新设置 div 的样式。

原文由 Rich Bradshaw 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

如果您使用的是 CSS3，那么 content 就是答案：

 .A img
{
    content: url("image2.png");
}

原文由 Michal Klouda 发布，翻译遵循 CC BY-SA 3.0 许可协议