Jump to content
Reese2012

HTML images will not load

Recommended Posts

Hello,

I have a question regarding getting images that I have downloaded from Bing images to appear on my website. I'm learning HTML and using JS Fiddle to practice my coding and when I type in <img src=" \Pictures\Saved Pictures\Cute-Puppies-puppies-22040876-1280-800.jpg">  I get a tiny box with an x in the middle. When I download the image, I save it to a file called Saved Pictrues. I've tried using <img src="Saved Pictures\Cute-Puppies-puppies-22040876-1280-800.jpg" alt="corgi pup" width="150px" height="150px"> and I still get the tiny box with a x in the middle and the name corgi pup is beside it. I'm majoring in Information Technology Management and I' very interested in web development so I feel a tad silly that I can't get an image to display. Is there something that I should be including in my file path? I also save the image to bing, so should I be including bing in the file path? Please help!

Share this post


Link to post
Share on other sites

You're right, the tiny box indicates a broken path.

There are reasons to have an absolute path and other reasons to have a relative path. 

absolute

<img src="https://pathToMyDomain.com/images/thisIsMyimage.jpg" alt="thisImage" width="xxpx">

relative

<img src="images/thisIsMyimage.jpg" alt=" thisImage " width=" xxpx ">

 

Hope that helps.

 

 

Share this post


Link to post
Share on other sites

You cannot use the path of a file that is on your computer. The image has to be hosted online.

Share this post


Link to post
Share on other sites

Try uploading it to a site like imgur and use the link to the image as a src attribute for your img element.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×