프로그래밍 언어/HTML,CSS,JS

CSS 배경 늘리기 및 크기 조정

Rateye 2021. 9. 1. 10:33
728x90
반응형
질문 : CSS 배경 늘리기 및 크기 조정

컨테이너를 채우기 위해 CSS의 배경을 늘리거나 확장하는 방법이 있습니까?

답변

background-size 를 사용하여이 작업을 수행 할 수 있습니다.

body {
    background-image: url(bg.jpg);
    background-size: cover;
}

cover 는 이미지를 수직 또는 수평으로 늘려서 타일 / 반복하지 않는 것을 의미합니다.

Safari 3 이상, Chrome, Opera 10 이상, Firefox 3.6 이상 및 Internet Explorer 9 이상에서 작동합니다.

Internet Explorer의 하위 버전에서 작동하려면 다음 CSS를 사용해보세요.

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.myBackground.jpg', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myBackground.jpg', sizingMethod='scale')";
출처 : https://stackoverflow.com/questions/376253/stretch-and-scale-css-background
728x90
반응형