background-position 속성

left top 왼쪽 상단                                                   

background-position:left top;

background-position:0% 0%;

 

left center 왼쪽 중앙

background-position:left center;

background-position:0% 50%;

 

left bottom 왼쪽 맨아래

background-position:left bottom;

background-position:0% 100%;

 

right top 오른쪽 상단

background-position:right top;

background-position:100% 0%;

 

right center 오른쪽 중앙

background-position:right center;

background-position:100% 50%;

 

right bottom 오른쪽 맨아래

background-position:right bottom;

background-position:100% 100%;

 

center top 가운데 상단

background-position:center top;

background-position:50% 0%;

 

center center 정 가운데

background-position:center center;

background-position:50% 50%;

 

center bottom 가운데 맨아래

background-position:center bottom;

background-position:50% 100%;

 

두가지 중 한가지만 쓰면 나머지는 자동으로 center 가 된다.

 

x% y% 

x는 가로위치, y는 세로위치.

0% 0% 는 left top과 같으며, 100% 100% 는 right bottom과 같다.

한 가지만 지정하면 나머지는 50%