Replace image src location using CSS

Question

I have a website that has an image with a src attribute and I would like to change the src location of that image with an image of my own. The image lives in a div component. I can't change the HTML and am looking ways to change it using CSS only please.

Div component:

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

Image component(CSS file):

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

Answer 1

You can use a background image

.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/">