CSS_배경 문법

CSS배경

●background-color
-HTML 요소의 배경색을 설정

●background-image
- html 요소의 배경으로 나타날 배경 이미지를 설정
- 배경 이미지는 기본 설정으로 반복되어 나타남
    background-image:url(파일경로)


●background-repeat
-배경 이미지를 수평이나 수직방향으로 반복하도록 설정(repeat-x repeat-y no repeat)

●background-position
-반복되지 않는 배경 이미지의 상대 위치를 설정
-%나 px을 사용해서 상대위치를 직접 설정할 수 있음
-상대 위치를 결정하는 기준은 왼쪽 상단(left top)

●background-attachment
- 위치가 설정된 배경 이미지를 원하는 위치에 고정시킬 수 있음
- 고정된 배경 이미지는 스크롤과 무관하게 화면 위치에서 이동되지 않음

속성 : fixed ,scroll

●background-size
- 배경 이미지 크기를 설정
- px, %, contain, cover

Size 속성값
contain
    *배경 이미지의 가로, 세로 모두 요소보다 작다는 조건하에 가능한 설정
    *가로, 세로 비율은 유지
    *배경 이미지의 크기는 요소의 크기보다 항상 작거나 같음

cover
    *배경 이미지의 가로, 세로 모두 요소보다 크다는 조건하에 가능한 설정
    *가로, 세로 비율은 유지
    *배경 이미지의 크기는 요소의 크기보다 항상 크거나 같음
    굉장히 많이씀