1KB Vue

How To Set Height And Width Of An Image In HTML

To set the height and width of an image in HTML, you can do it in several ways. Here are the most common ones:

 Option 1: Inline with HTML Attributes

<img src="image.jpg" width="300" height="200" alt="Description">

 Option 2: Using Inline CSS

<img src="image.jpg" style="width: 300px; height: 200px;" alt="Description">

 Option 3: Using a CSS Class

<style>
  .custom-img {
    width: 300px;
    height: 200px;
  }
</style>

<img src="image.jpg" class="custom-img" alt="Description">

Notes:

  • Always include the alt attribute for accessibility and SEO.

  • Use object-fit: cover; in CSS if you want the image to maintain aspect ratio and fill the space.

Need help with making it responsive or maintaining aspect ratio too?

Mise Ă  niveau vers Pro
Choisissez le forfait qui vous convient
Lire la suite
Flowisetech Salut , For easy access