The img (image) element is an inline element as Scooby Doo demonstrates.
It's also an empty element (no closing tag).
The content comes from the src (source) graphic, which is in a file named Scooby.png, completely distinct from the .html file that makes the page.
In many cases, you don't want the image inline with the text, so just put it in a block like below.
Once you learn CSS, you will be able to fully control the alignment of images inline with text or inside blocks.
For now, just put them in your page.
Notice that the value of each src attribute for the images above is just the name of the image file.
That is because the image is located in the same folder as this HTML file.
Observe this image doesn't show up
in the page. If you download the files for this example, you will see that the image file homer.gif is inside a folder named images. So imbedding Homer in this page requires
. This src value says look inside the images folder for the homer.gif file. This is an example of a relative URL specifying the location of the image file relative to this document.
The W3C says that all images should use the alt attribute which gives an alternate text description of the graphic for text-to-speech Screen Readers. Some browsers will also display the alt text if an image fails to render in the page, like the first Homer above.