HTML img tag

HTML <img> tag adds image in the web page. We write the proper address of an image in the src attribute of the image tag.

<p>Alt text is visible when image is not available.</p>
 <img src="files/logo.png" alt="codingb logo"/>
</>

Alt text is visible when image is not available.

Tag omission

img element is self closing tag i.e. there is no end tag.

Global Attributes

All the global attributes are applicable on the img element.

Tag Attributes

Attributes that are applicable to <img> tag

alt: It represents the alternate text when image is not available.; <img src="" alt="alternate text">
src: It represents the location of the image.; <img src="address of the image" >
crossorigin: It indicates how to manage crossorigin requests.
usemap: This contains the name of image map to use.
usemap: This contains the name of image map to use.; <img src="Location of the image" usemap="name of the map tag">
width: It represents teh horizontal dimension of the image.; <img src="URL" width="400">
height: It represents the vertical dimension of the image.; <img src="address of image" height="400">

path problem

The name of the image has been given along with the type extension (my logo.png) in the src attribute. when image and the file (in which image is used) are in the same folder then the name is written only.

But if the image and file (in which image is used) are at the different locations, then absolute address should be given in the src attribute along with the name and extension. For instance,

<p> Here the complete path has been given in the src attribute. </p>
<img src="http://www.web4college.com/html_tags/files/logo.png" alt="web4college logo" />
Try</>

Tip: The path problem is solved in the same way as has been described above for all the elements having src attribute.

Next Previous