freeCodeCamp/guide/english/html/attributes/img-src-attribute/index.md

1.3 KiB

title
Img Src Attribute

Img Src Attribute

The <img src> attribute refers to the source of the image you want to display. The img tag will not display an image without the src attribute. However, if you set the source to the location of the image, you can display any image.

There is an image of the freeCodeCamp Logo located at https://avatars0.githubusercontent.com/u/9892522?v=4&s=400

You can set that as the image using the src attribute.

<html>
  <head>
    <title>Img Src Attribute Example</title>
  </head>
  <body>
    <img src="https://avatars0.githubusercontent.com/u/9892522?v=4&s=400">
  </body>
</html>

The above code displays like this:

The freeCodeCamp Avatar

The src attribute is supported by all browsers.

You can also have a locally hosted file as your image.

For example, <img src="images/freeCodeCamp.jpeg> would work if you had a folder called images which had the freeCodeCamp.jpeg inside, as long as the 'images' folder was in the same location as the index.html file.

../files/index.html

..files/images/freeCodeCamp.jpeg

More Information: