Cannot see images from my computer on my website in HTML-CodePudding

I'm trying to add an image into my HTML file directly from my computer but it wont show up on my webpage.

I have a folder named portfolio containing my HTML file and CSS file. Under portfolio I have another folder named images containing all my images I wish to use.

This is the code I'm using:

 <div >
       <img  src="images/project-1.jpg" />
      <img  src="images/project-2.jpg" />
      <img  src="images/project-3.jpg" />
      <img  src="images/project-4.jpg" />
    </div>

CodePudding user response：

this would be correct if the folder "images" is inside the "portfolio" folder

try using src="../images/project-4.jpg" instead

edit: if by "under" it you mean inside it, try changing the "../" with "./" it could also be a typing mistake so make sure to copy the folder/images names

CodePudding user response：

images folder and the file (index.html) in which you are using these images must be in same root directory (portfolio) folder.

 ---  index.html(file)
|
|         <div >
|            <img  src="images/project-1.jpg" />
|            <img  src="images/project-2.jpg" />
|            <img  src="images/project-3.jpg" />
|            <img  src="images/project-4.jpg" />
|         </div>
|    
|
|
 ---  images(folder)

         project-1.jpg
         project-2.jpg
         project-3.jpg
         project-4.jpg