how to add image in html | add image in html

how to add image in html | add image in html

Hey friends, today I’ll  teach how to images in HTML. Before we dive in, I’ll introduce myself. I’m CodingPorium and I make coding tutorials and provide Free Source Code. Do check out my YouTube channel at here or by searching for CodingPorium on YouTube for more!

The <img> tag in Html

The most simple, easy, and common method to add images in HTML is through the <img> tag. Img actually stands for Image. 

However, I honestly find the <img> tag as something really interesting. This is because usually HTML tags have a start tag and close tag but the <img> tag does not have a close tag.
Okay, now that you’ve understood about <img> tag, let’s see how to link it to your image file path.

src attribute

Inside it our <img> tag, add the src attribute. Src stands for source. So below is a simple example of how to combine img and src together into a HTML image.

I understand that when you see the example above, you might feel like the image is too large and you want to have some control on the image size. 

We can do it with basic inline CSS. Don’t get shocked when you hear that we need to use CSS, because it’s a super simple job.

Javascript project ideas with complete source code 

Styling HTML image size

We can style the image size by using the style attribute and adding simple CSS inside it. Check out the code below.

And that’s it! You can now add images to your HTML website to make it better.

Thank You!

Do contact me at or comment down below any doubts or suggestion you have. Do subscribe to my YouTube channel and do follow me on Instagram. I hope this post was useful and thanks to Code With Random for giving me the chance to write here and I hope to see you all in future posts. Goodbye!

Written by: @codingporium 

Share on:

Leave a Comment