배경

컴포넌트의 배경색상 또는 배경 이미지를 설정하는 속성입니다.

사용방법

1. 배경을 설정할 컴포넌트를 선택합니다.

2. 배경을 활성화 합니다.

3. 원하는 색상을 선택합니다.

4. 또는 배경 이미지를 설정할 수 있습니다. (단, 스텝에는 배경 이미지 추가 불가)

5. 배경이미지를 로컬이나 프리픽을 통해 등록합니다.

6. 이미지 반복, 위치, 사이즈를 디테일하게 설정 합니다.

기능설명

모양	기능	속성	의미
	배경색		컴포넌트의 배경 색상 변경
	배경이미지	URL	이미지 URL로 설정
		내 PC에서 업로드	배경이미지를 로컬 또는 프리픽을 통해 업로드
		로컬이미지	내 PC에 있는 이미지를 업로드
		프리픽이미지	프리픽 이미지 사이트에서 검색해 업로드
	이미지 반복	Repeat	배경 이미지가 왼쪽부터 가로로 정렬
		no-repeat	배경 이미지를 x축과 y축으로 반복 설정
		Repeat-x	배경 이미지를 x축으로 반복 설정
		Repeat-y	배경 이미지를 y축으로 반복 설정
		Space	배경 이미지가 공간에 맞게 반복되며 여백 생김
		Round	배경 이미지가 공간에 맞게 여백 없이 반복
	Position	Left Top	배경 이미지 위치를 좌측 상단으로 설정
		Left Center	배경 이미지 위치를 좌측 중앙으로 설정
		Left Bottom	배경 이미지 위치를 촤측 하단으로 설정
		Center Top	배경 이미지 위치를 중앙 상단으로 설정
		Center Center	배경 이미지 위치를 정중앙으로 설정
		Center Bottom	배경 이미지 위치를 중앙 하단으로 설정
		Right Top	배경 이미지 위치를 우측 상단으로 설정
		Right Center	배경 이미지 위치를 우측 중앙으로 설정
		Right Bottom	배경 이미지 위치를 우측 하단으로 설정
		직접입력	배경 이미지 위치를 수치로 설정
	단위	%	상위 그룹/레이아웃의 사이즈에 따라 백분율로 값 설정
		px	고정값 설정
		x축	배경 이미지 x축 위치를 입력한 수치만큼 이동해 설정
		y축	배경 이미지 y축 위치를 입력한 수치만큼 이동해 설정
	Size	Auto	이미지의 실제 크기로 표현
		Cover	이미지를 컴포넌트 크기, 화면 크기에 맞게 공백 없이 설정
		Contain	이미지를 컴포넌트 크기, 가로와 세로 비율은 유지되면서 설정
		직접입력	이미지의 크기를 수치로 설정
		너비	배경 이미지 너비 설정
		높이	배경 이미지 높이 설정

결과예시

배경색상 설정 예시

배경색상 사용 전

배경색상 사용 후

따라하기

배경이미지 설정 예시(프리픽)

화면 속 [시작하기]버튼을 눌러 데모를 확인하실 수 있습니다.