使用 CSS 替换图片 src 位置

Question

我有一个网站有一个带有 src 属性的图像，我想用我自己的图像更改该图像的 src 位置。图像存在于 div 组件中。我无法更改 HTML，正在寻找仅使用 CSS 更改它的方法。

分区组件：

 <div class="application-title">
<img style="margin-top: 3px;height: 45px;" src="image.svgz">
</div>

图像组件（CSS文件） ：

 .application-title IMG
{
    float: left;
    margin-top: 5px;
    margin-right: 10px;
    opacity: 1;
    margin-left: 0px;
    visibility: hidden;
}

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

Answer 1

您可以使用背景图片

 .application-title img {
  width:200px;
  height:200px;
  box-sizing:border-box;
  padding-left: 200px;
  /*width of the image*/
  background: url(http://lorempixel.com/200/200/city/2) left top no-repeat;
}

 <div class="application-title">
  <img src="http://lorempixel.com/200/200/city/1/">
</div><br />
Original Image: <br />

<img src="http://lorempixel.com/200/200/city/1/">

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

Answer 2

这是另一个肮脏的技巧 :)

 .application-title > img {
display: none;
}

.application-title::before {
content: url(path/example.jpg);
}

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