HTML img Tag | HTML <img> Tag | img Tag Tutorial by WDH

HTML img Tag


HTML Image Attributes

  • src – The src attribute is used to specify the location or URL of a particular image (defined by the <img> element).
  • alt – Used to specify some alternative text related to the image, which is displayed if the user cannot view the image due to some inevitable reasons.
  • height – Used to specify the height of the image in pixels.
  • width – Used to specify the width of the image in pixels.
  • border – The border attribute is used to add a border to an image. By default, the border is set as 0 and can be varied as per the desired thickness.
  • align – By default, the image is set to the left of the web-page, it can be shifted to the right or center as per the preference, using the align attribute.
  • style – The style attribute is used to manipulate and style the images using CSS.

HTML Image Styling using CSS

1. Align in HTML

Code:

<html>

<head></head>

<body>

<img src="images/rainy.gif" alt="rainy" width="100px" height="100px" style="vertical-align:bottom">

<img src="images/rainy.gif" alt="rainy" width="100px" height="100px" style="vertical-align:middle">

<img src="images/rainy.gif" alt="rainy" width="100px" height="100px" style="vertical-align:top">

<img src="images/rainy.gif" alt="rainy" width="100px" height="100px" style="float:right">

<img src="images/rainy.gif" alt="rainy" width="100px" height="100px" style="float:left">

</body>

</html>