HTML Images

Images make websites look nice. In HTML, we use the <img> tag to show images.

1. Basic Image Tag

Use <img> with src (image URL) and alt (description):

<img src="images/nature-forest.png" alt="Green Forest">

Live Preview:

2. Alt Attribute

The alt text is shown if the image cannot load. It helps users who cannot see images.

<img src="images/mountain-view.png" alt="Beautiful Mountain View">

Live Preview:

3. Image Size (Width & Height)

You can make the image bigger or smaller using width and height:

<img src="images/sunset-city.png" alt="City Sunset" width="300" height="200">

Live Preview:

4. Linking an Image

You can make an image clickable by wrapping it in an <a> tag:

<a href="https://aswcode.com">
  <img src="images/fresh-fruits.png" alt="Fresh Fruits">
</a>

Live Preview:

Next Lesson → HTML Links

Previous Lesson → HTML Forms