[ CSS ] background 배경

참조 : http://pungwun.blog.me/220590183478

background-color

background-color : blue; /* 색상이름 */
background-color : #0000FF; /* 16진수 RGB 색상값 */
background-color : rgb(0,0,255); /* RGB 색상값 */
background-color : rgba(0,0,255,1); /* 알파값이 적용된 RGB 색상값 0 ~ 1 */


background-image

background-image : url("파일경로");


background-repeat

background-repeat : no-repeat; /* 배경이미지를 반복하지 않음 */
background-repeat : repeat; /* 기본값으로 배경이미지를 반복 */
background-repeat : repeat-x; /* x 축(가로) 반복 */
background-repeat : repqat-y; /* y 축(세로) 반복 */


background-attachment

background-attachment : scroll; /* 기본값 스크롤에 따른 위치 변경 */
background-attachment : fixed; /* 배경이미지 고정 */
background-attachment : local; /* scroll 비슷하지만 거의 사용하지 않음 */


background-position

background-position : 10px -10px; /* 좌표값으로 설정 (-) 값 사용가능 */
background-position : 100% 100%; /* %값으로 설정 */
background-positon : center center; /* 상수값으로 설정 */

left top / center top / right top
left center / center center / right center
left bottom / center bottom / right bottom


background-size

background-size : auto; /* 기본값 이미지 본래 크기 */
background-size : 100px 250px; /* 픽셀로 크기 설정 */
background-size : 50% 100%; /* %로 크기 설정 */
background-size : cover; /* 부모요소의 가로사이즈에 맞추어서 크기지정 */
background-size : contain; /* 부모요소의 세로사이즈에 맞추어서 크기지정 */
background-size : initial; /* 이미지의 기본값 적용 */