Is it possible to use a local image in an HTML or CSS project using Javascript or any other means?

Question

The best I can do is:

<img width='220' height='280' src='chrome-extension://okjaohhbffepkcfacapapdhkmnebgiba/johnny.jpg' class="me"/>

but this will only display the image in Chrome. Is there any way to do this so the image will show in all browsers?

Thanks in advance, Dzhon

You could base64 encode the image and include it in the HTML as a data URI: stackoverflow.com/questions/1207190/embedding-base64-images — Rory McCrossan
– Rory McCrossan, Commented Mar 27, 2017 at 21:04

Jonny Perl · Accepted Answer · 2017-03-27 21:06:28Z

1

You can encode the image as base64 and then call in in using CSS. There's a nice guide here: https://css-tricks.com/data-uris/

answered Mar 27, 2017 at 21:06

Jonny Perl

1336 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

You also need a converter if you don't want to write one yourself: askapache.com/online-tools/base64-image-converter