Images


Images can be used to improve the appearance of a webpage. To display an image on a web page, we can use the tag. It is an empty element which means it has only attributes and no closing tag. We can use any image format such as jpeg, png, or gif. It should be properly specified in the src attribute as the image name is case-sensitive. The images to be displayed should be in the same directory as the code. If the image is not displayed properly, the alternate text specified in the alt attribute gets displayed.

HTML image tag attributes

The src and alt elements of the HTML image tag are crucial. The HTML image tag's characteristics are listed below.

  • src: It's a required attribute that describes the image's source or path. It tells the browser where to look on the server for the picture. The image could be in the same directory or on a different server.
  • alt: If the image can't be displayed, the alt attribute specifies an alternative text. The alt attribute's value describes the image in words. The alt attribute is seen to be beneficial to SEO.
  • width: It's an optional attribute that specifies the image's width for display. It is not advised at this time. Instead of using the width attribute, you should use CSS.
  • height: It is h3 the image's height. Iframe, picture, and object elements are all supported by the HTML height attribute. It is not advised at this time. Instead of using the height attribute, you should use CSS.

Example No.1:

<html> <body> <h2>Knowledge2life</h2> <img src="Knowledge2life.jpg" > </body> </html>

OUTPUT:

Knowledge2life

img_logo

Example No.2:

<html> <body> <h2>Knowledge2life</h2> <img src="Knowledge2life.jpg" width="400" height="233"> </body> </html>

OUTPUT:

Knowledge2life

img_logo