HTML image is not showing on the webpage when I try it using the full image image path, no issue on using the url of image as the image source

Viewed 39

I was trying to put an image from my system to my webpage by giving the address of the image as image source, but the image doesn't show there. I don't face this problem while using a URL as an image source. Can anyone please tell me how to put an image from the system itself on a webpage?

 <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>CSS Display property</title>
    </head>
    <body>
        <header class="top">
            <img src="E:\Folders\ichchha.jpeg"/>
            <h3>Welcome to Ichchha's Blog</h3>
        </header>
    </body>
    </html>
1 Answers

The src attribute for an <img> should contain a URL, not a file name. The usual way to get an image into the page would be to move it to the same directory as the HTML file and use a relative URL:

<img src="ichchha.jpeg"/>

If you are opening the HTML file locally (without a webserver) and you really need to have it load the image from that particular absolute file path, you could do so like this:

<img src="file:///E:/Folders/ichchha.jpeg"/>

Note that file: URLs use the file:/// prefix and use forward slashes between directories rather than backslashes. The problem with this solution is that isn't going to work when your HTML file is hosted on a web server. It will only work when your HTML file is loaded from a file:/// URL itself.

Related