[이슈] background image

배경화면 넣는 속성

 

1) background-image

 

- 입력 이미지 설정

- url(이미지) 형태로 입력

 

2) background-size

 

- 가로와 세로 길이를 입력

- background-size: 10px 10px 형태로 입력

- cover속성: 배경을 사용하는 요소를 다 채울 수 있게 이미지를 확대 또는 축소합니다. 가로 세로 비율을 유지합니다. 얘는 이미지가 최대한 크게 보여진다는 뜻.(웹페이지 전체 배경에 사용하기 좋음)

- contain속성: 배경을 사용하는 요소를 벗어나지 않는 최대 크기로 이미지를 확대 또는 축소합니다. 가로 세로 비율을 유지합니다(어플 배경에 사용하기 좋음)

 

3) background-repeat

 

- 배경화면의 반복에 대한 설정

- no-repeat으로 해두면 하나만 나옴

 

4) background-color

 

- 색깔 설정

 

5) background-position

 

- 위치 설정

 

6) background-attachment

 

- 배경이미지에 대한 스크롤 여부(선택한 요소와 같이 움직일 것인가)