Adjusting Image Width and Height

Let's explore how to change the width and height of an image.

When setting the width and height of an element, use the width and height attributes.

This attribute specifies the horizontal length of an element and can use units such as pixels (px) and percentages (%).

For example, width: 300px; sets the horizontal length of the element to 300 pixels.

This specifies the vertical length of an element.

Similarly, you can use units such as pixels (px) and percentages (%) to assign a value.

For instance, height: 200px; sets the vertical length of the element to 200 pixels.

The CSS code below sets the width and height of the profile-image class to 150px.

Copy
.profile-image {
  width: 150px;
  height: 150px;
  border-radius: 50%;
}

In the next lesson, we'll add an animation effect to move the profile up and down.