본문으로 건너뛰기

이미지의 높이, 너비 조절하기

이미지의 높이, 너비 조절하기

이제 이미지의 너비와 높이를 바꾸어보겠습니다.

요소의 너비와 높이를 지정할 때는 widthheight 속성을 사용합니다.

  1. width: 요소의 가로 길이를 지정합니다. 이 속성은 픽셀(px), 백분율(%) 등의 단위를 사용하여 값을 지정할 수 있습니다. 예를 들어, width: 300px;는 요소의 가로 길이를 300픽셀로 설정합니다.

  2. height: 요소의 세로 길이를 지정해요. 마찬가지로 픽셀(px), 백분율(%) 등의 단위를 사용하여 값을 지정할 수 있습니다. 예를 들어, height: 200px;는 요소의 세로 길이를 200픽셀로 설정합니다.

아래 CSS 코드는 profile-image 클래스의 가로 길이와 세로 길이를 150px로 지정합니다.

이미지 너비, 높이, 테두리 속성 지정
.profile-image {
width: 150px;
height: 150px;
border-radius: 50%;
}

다음 수업에서는 프로필을 위 아래로 움직이는 애니메이션 효과를 넣어보겠습니다.