Do you want to be a good Web Developer?

Enter Your Email To Get Our Exclusive Tutorials Right In Your Email

HTML Images

HTML Images


You can insert any image in your webpage.Main types of images are image.jpg,image.jpeg,image.png,image.gif.Image tag(<img>) has no end tag.


The syntax to insert image in your webpage:


<img src="demo.jpg">

Code Explanation

  • src is the location attribute it gets the image from that location.
  • demo is the name of the image
  • .jpg is the type of the image



The alt Attribute

alt attribute value is displayed when there is problem in displaying the image.


<img src="demo.jpg" alt="demo.jpg image">




Width and Height of Image

alt attribute value is displayed when there is problem in displaying the image.


<img src="demo.jpg" alt="demo.jpg image" width="200" height="150">


  • width="200" makes the width of the 200
  • height="150" makes the height of the 150
  • You can use style attribute to style the image.You will learn more in HTML Style Chapter and In CSS Tutorials.




Image from other folder or location

You can insert images from other folder or in whatever location your image is situated just by giving the link of that loaction in src with imagename.type.


<img src="images/demo.jpg" alt="demo image" width="200" height="150">


  • we insert the image from images folder of same directory.




  • Image as a link

    You can insert image tag(<img>) inside the <a></a> and then your image is work as a link.


    <a href="somewhere.com"><img src="images/demo.jpg" alt="demo image" width="200" height="150"></a>

    PreviousNext

    Join Us With Our 21000+ Subscribers And Get Our Latest Tutorials Update Via Email