Why won't my images from my computer show up in my html file I had no issue using images from the web using the url. I saved my html file, css and images all in on folder but it doesn't show up on the website. This is the code I used using Sublime Text Editor.

<div>
  <img src="/images/profile-pic.jpg"/>
  <h1 id="myname">John Smith</h1>
  <h3>Web developer</h3>
  <p>{{ pause and ponder }}</p>
</div>
  </div >

CodePudding user response：

Another easy way to do this.

Go to your files on your system, navigate to the folder where your image is stored right click and click properties then copy out the address there.

CodePudding user response：

Just give a correct path of the image in the html file and remove the forward slash (/) behind the path.

CodePudding user response：

Most likely you're in a new directory and need to come back up one level. You could try:

<img src="../images/profile-pic.jpg"/>

CodePudding user response：

Now on folder structure, this is how you arrange your documents.

First create a folder for your entire website. Let's call it "Codes" Then in codes add the HTML file and name it "index"(easier for the browser to recognize when hosting) the along side the index create another folder for your additional material. Example images, font files, CSS files,videos and lot more. Name the folder asset. Then in asset, create a folder for keeping the images only, another for CSS files and another for font files.

Then you are done Copy address from the first folder created( this is easier)

CodePudding user response：

Now you provided screenshots, I can try to help better. In the folder tree, you can see folder named Portfolio and folder named Images are on same level. Because of this, when you are inside of folder Portfolio, you should navigate one level up.

Please try to use

<img src="../images/profile-pic.jpg">