Is it possible to set the equivalent of a src attribute of an img tag in CSS?

Use content:url("image.jpg").

Full working solution (Live Demo):

<!doctype html>

<style>
.MyClass123{
    content:url("http://imgur.com/SZ8Cm.jpg");
}
</style>

<img class="MyClass123"/>

Tested and working:

  • Chrome 14.0.835.163
  • Safari 4.0.5
  • Opera 10.6
  • Firefox 100 & newer

Tested and Not working:

  • FireFox 40.0.2 (observing Developer Network Tools, you can see that the URL loads, but the image is not displayed)
  • Internet Explorer 11.0.9600.17905 (URL never loads)

Leave a Comment

tech