Description

The src attribute tells the browser where to look for the image that should be presented to the user. This image may be located in the same directory as the page that’s referencing the file, in another directory on the same server, or on another server entirely.

The example specifies an image that’s located in the same directory as the web page that’s calling it, but if the submit image was located in a directory that was one level higher than the referencing document, the syntax would be as follows:

<input type="image" src="../submit.jpg"
    alt="Submit your details"/>

Here, ../ equates to "move up one directory in the hierarchy.”

You can also reference an image relative to the web site’s root (the folder or file after the domain name):

<input type="image" src="/submit.jpg"
    alt="Submit your details"/> 

This attribute markup basically says, “display the image submit.jpg that can be found in www.mydomain.com/.” This is a very handy way of referencing files, as you can move the document containing the submit image to another location on the file system without having to change the link.

If you were referencing an image that’s held on another server, you’d express the src using a complete URI, as follows:

<input type="image" src="http://www.some-domain.com/submit.jpg"
    alt="Submit your details"/>  

Value

This attribute takes as its value the location of the button image relative to the referencing document, relative to the server root, or as a complete URI containing http:// or https://, the server name, and the path to the document on that server.

Compatibility

It causes no compatibility issues, and has excellent support across all tested browsers.