이미지 조절하기
img 태그의 width와 height 속성으로 이미지 크기를 조절할 수 있습니다. 예를 들어,
이미지 크기 조절하기
<img src="image.jpg" alt="이미지 설명" width="300" height="200" />
위 코드는 이미지 크기를 가로로 300px, 세로로 200px로 설정합니다.
이미지 크기를 지정하지 않으면, 이미지 원본 파일의 크기로 표시됩니다.
원형 이미지 만들기
border-radius
는 요소의 모서리를 둥글게 만드는 CSS 속성입니다. 이미지를 원형으로 만들거나, 박스의 모서리를 둥글게 만들 때 사용합니다.
border-radius
속성은 다음과 같이 사용할 수 있습니다.
border-radius 속성 사용하기
선택자 {
border-radius: 값;
}
여기서 선택자
는 모서리를 둥글게 만들고 싶은 요소를 가리킵니다. 값
은 얼마나 둥글게 만들지를 픽셀(px)이나 백분율(%)로 지정합니다.
예를 들어, 다음과 같은 CSS 코드는 box
라는 클래스를 가진 요소의 모서리를 10px만큼 둥글게 만듭니다.
모서리 둥글게 만들기
.box {
border-radius: 10px;
}