CSS3는 웹 페이지에 여러 배경 이미지 추가를 지원합니까?

css3은 웹 페이지에 여러 배경 이미지 추가를 지원합니다. CSS에서는 background-image 속성에 여러 배경 경로를 직접 지정하여 웹 페이지에 여러 배경 이미지를 추가할 수 있습니다. 구문 형식은 "Background-image: url(이미지 주소), url(이미지 주소)...; " .

이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.

CSS에서 여러 배경 이미지 사용

배경에 두 개 이상의 이미지를 추가하려면 어떻게 해야 하나요? 아래와 같이 CSS3에서 여러 배경 경로를 직접 지정할 수 있습니다.

body {
  background-image: url(https://image.flaticon.com/icons/svg/748/748122.svg), url(https://images.unsplash.com/photo-1478719059408-592965723cbc?ixlib=rb-1.2.1&auto=format&fit=crop&w=2212&q=80);
  background-position: center, top;
  background-repeat: repeat, no-repeat;
  background-size: contain, cover;
}

Rendering:

전체 예시 주소: https://codepen.io/duomly/pen/eYpVoJR

(학습 동영상 공유 : css 동영상 튜토리얼)

위 내용은 CSS3는 웹 페이지에 여러 배경 이미지 추가를 지원합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!