It does not work because src
attribute of an <img>
tag is not supposed to contain the raw data of an image; rather, it is supposed to contain a URI that points to the image data.
By using data:
URIs, you can embed the image directly in your (X)HTML document. Note that this will not work in many browsers such as older versions of Internet Explorer. As well, there are limits, such as the 32KB limit IE8 places on data:
URIs.
Using PHP, here's what your code would look like:
<img src='data:image/png;base64,<?php echo base64_encode(file_get_contents("dir/dir/img.png")); ?>'>
Don't forget to change the image/png
part of the URL if the type of image that you are using changes. For example, if you use a GIF image, change it to image/gif
.