CSS를 사용하여 배경 이미지를 Div에 완벽하게 맞추는 방법은 무엇입니까?

배경 이미지를 Div에 맞추기

div 내에 배경 이미지를 배치할 때 이미지가 잘리는 문제가 흔히 발생합니다. 꺼져 있거나 제대로 맞지 않습니다. 이 문제를 해결하기 위해 CSS는 배경 이미지의 크기 조정 및 위치 지정을 정밀하게 제어할 수 있는 background-size 속성을 제공합니다.

Div 내부에 맞게 배경 이미지 크기 조정

배경 이미지가 잘리지 않고 div 경계 내에 표시되도록 하려면 배경 크기 속성을 다음으로 설정하세요. 포함:

background-size: contain;

전체 Div를 덮도록 배경 이미지 크기 조정

또는 배경 이미지가 전체 div를 차지하도록 하려면, 덮개를 사용하여 크기를 조정하세요.

background-size: cover;

비주얼 데모

배경 이미지가 포함된 div가 있는 다음 HTML 코드를 고려하세요.

<div>

이미지가 잘리는 것을 방지하려면 배경 크기 속성을 적용하세요.

#mainpage {
  background-size: contain;
}

또는 이미지가 전체 div를 덮도록 하려면:

#mainpage {
  background-size: cover;
}

위 내용은 CSS를 사용하여 배경 이미지를 Div에 완벽하게 맞추는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!