Web Standards Programmer's Reference: HTML, CSS, JavaScript®, Perl, Python®, and PHP

5.3. Inserting Images into Web Documents

The image tag (<img>) is used to insert images into XHTML documents. The tag has the following minimal syntax:

<img src="url_to_image" alt="text_for_non_graphical_agents" />

The two parameters, src and alt, define where to find the image and text to display if the user agent can't display the image (or is set not to display images at all). These two parameters comprise the minimal set of parameters for any image tag.

As with other tags that lack a closing mate, you should end the <img> tag with a slash to be XHTML compliant.

For example, the following tag will insert an image, cat.jpg, into the document with the alternate text "A picture of a cat":

<img src="cat.jpg" alt="A picture of a cat" />

In this case, because the src does not contain a server and full path, the image is assumed to be in the same directory, on the same server, as the XHTML document. The following tag gives the full URL to the image, which could conceivably be on a different server than the document:

<img src="http://www.example.com/animal_images/cat.jpg" alt="A picture of a cat" />

Note that it is a good practice to store images separately from documents. Most Web authors use a directory such as images to store all images for their documents.

The user agent will attempt to display the image in-line (that is, alongside elements around it). For example, consider the following code snippet:

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod ...