background-color 
- 배경 스타일을 위한 속성  배경색을 채웁니다.  정의한 색상으로 border와 padding을 포함한 영역을 채웁니다.  margin영역은 제외
- https://www.relation.co.kr/images_board/board_system_publishing/2/


-기본값 : transparent
- 상속 : no
- 에니메이션 : Yes
- 버젼 : CSS level 1

문법
background-color : transparent | color | initial | inherit
- transparent : 배경색이 없습니다.
- color : 색을 정합니다.
- initial :  기본값으로 설정합니다.
- inherit : 부모의 요소의 속성값을 상속 받습니다.
 

// background-color: 배경색을 지정 (yellow, #FFFF80, Ivory) 
<div style="height:50px; background-color: #FFFFF0">
  ivory배경색이 지정된 예제
</div>

 

//background-image: 배경 이미지를 지정할 수 있습니다. url(bg.gif) 
<div style="width:250; height:250; background-image: url(bg.gif)"></div>

background-repeat: 배경 이미지의 반복 여부를 지정. repeat, repeat-x, repeat-y, no-repeat
background-repeat: 배열 방법
repeat : 가로/세로로 타일처럼 반복.
repeat-x : 왼쪽 위부터 가로 방향으로만 반복.
repeat-y : 왼쪽 위부터 세로 방향으로만 반복.
no-repeat : 반복하지 않고 한번만 나타냄. 

//background-position: 배경 이미지의 위치 지정.( top left, top center, top right, center left, center center, center right, bottom left, bottom center, bottom right) 
<div style="width:250; height:250; background-image: url(bg.gif) ; background-repeat:no-repeat"></div>

배경이미지를 고정시킵니다.
background-attachment : 고정 여부

** 고정여부
fixed : 배경 이미지 위치를 고정시킨다.
scroll: 배경 이미지를 다른 내용과 함께 스크롤한다.


** 배경고정, 브라우져에 크기에 따라 이미지 크기변동

<style>
  .bg {position: fixed;width: 100%;height: 100%;background-image: url(images/gs_gatebg.jpg);background-size:cover; background-position: center top;}
</style>

** 배경이미지를 좌표로 불러오는 방법
- background-color: #fff;
- background-image: url(bg.png);
- background-position: 50px 50px;
- background-repeat: no-repeat;

위 속성들을 아래와 같이 한줄로 작성 (속기법)

<style>
 .background_test1 { background: #fff url(bg.png)50px 50px no-repeat; }
</style>

출처 
https://www.codingfactory.net/10588