Insert image from Mac finder into HTML

Question

I am trying to add an image from my downloads in my Mac Finder (using HTML) but the image won't show up when I've tried.

I opened the image with Chrome to get a link: Users/oliviamartin/Downloads/flatweb.jpg

And formatted it like this:

<img src="file:///Users/oliviamartin/Downloads/flatweb.jpg" class="img-fluid" alt="Responsive image">

But no image appears after putting into the code.

Any help would be appreciated!

<img src="file:///Users/oliviamartin/Downloads/flatweb.jpg" class="img-fluid" alt="Responsive image">

Not sure why the code isn't showing up: here it is <img src="file:///Users/oliviamartin/Downloads/flatweb.jpg" class="img-fluid" alt="Responsive image"> — Olivia
– Olivia, Commented Mar 25, 2023 at 19:17
Are you serving the HTML in which you’ve included this markup with a proper HTTP server? If so, your browser will disallow file:/// links as it would otherwise represent a very large security risk if any arbitrary website could read files from your filesystem. — esqew
– esqew, Commented Mar 25, 2023 at 19:20
Who else do you expect to be viewing the HTML page? They are unlikely to have a /Users/oliviamartin folder on their computers, And even less likely to have a Downloads/flatweb.jpg file therein if they somehow do. — Heretic Monkey
– Heretic Monkey, Commented Mar 25, 2023 at 19:26
I tried on my Mac and it works. The question is: how do you open the HTML file? You just "throw" it to the navigator window? You use the web server on the Mac? You put this HTML on a web server? — Peter
– Peter, Commented Mar 25, 2023 at 19:26

Quinn Keaveney · Accepted Answer · 2023-03-27 01:30:46Z

0

If you are hosting this HTML page on a local server (which I believe you are) then place your image within that directory Users/oliviamartin/documents/github/project/imgs/flatweb.jpg. You can then serve that image from the directory with a relative url /imgs/flatweb.jpg.

answered Mar 27, 2023 at 1:30

Quinn Keaveney

1,7342 gold badges24 silver badges48 bronze badges

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

Collectives™ on Stack Overflow

Insert image from Mac finder into HTML

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related