-2

I have an assignment for my class, and it involves us creating a dummy website about anything using HTML and CSS. I learned the basics of HTML but this is something I don't understand...

On visual studio code, I basically have a total of 12 folders, and 14 files. From my main page (index.html) I have created a webpage that has all the human body components and also has a little link the viewer can access if they want to look at a more "in-depth" view of the components within that particular human body system. But when I try to add a picture within another folder using the same way I have done for the home page, It doesn't provide an image.

I use this <img src="Images/my_picture.png"> , but for some reason it isn't working anymore

I will provide a screenshot of my code and the result, someone please help me out!

enter image description here

as you can see within the folder "Integumentary_sys_comp" I have a line of code at line 40 stating I want to insert an image. I am pretty sure this is correct as I have used it before for the index.html page.

This is the result - enter image description here

As you can see there is no image!

Bhavis456
  • 21
  • 2

2 Answers2

1

Youhave to add "../"

src="../Images/my_picture.png"

PDSSandeep
  • 179
  • 10
  • I'm not sure what you mean by this, would you mind elaborating further, please? – Bhavis456 Jul 25 '21 at 00:26
  • 1
    ../ this will navigate to your images folder one step back. If we add ../../ this will navigate 2 steps back to your images folder – PDSSandeep Jul 25 '21 at 00:27
  • If your links at the top do not work (index and about), then I agree with this answer. The current page is in a directory of it's own that is adjacent to the images directory, so you need .. to go up a directory first, as in ../Images/Skin_anatomy_pic.png – Steve Williams Jul 25 '21 at 00:28
  • Wow you're right the navigation bar doesn't work. Thank you for helping me with the image problem. Do I just add the same "../" to the beginning of the links for the navigation bar as well? – Bhavis456 Jul 25 '21 at 00:31
  • 1
    yes you have to add – PDSSandeep Jul 25 '21 at 00:32
  • Thank you so much I will keep this in mind1 :) – Bhavis456 Jul 25 '21 at 00:33
0

Yes the img syntax is correct but I think the src is wrong. I cant see it among the files you have under the image folder. You may need to check again and add the correct file.

Also, it is necessary to fill the 'alt' so whenever ur image doesn't load, it will tell your users what kind of image is contained there.

Opo
  • 9
  • 1