CSS 배경 스타일

배경 이미지 스타일 background-image

background-image:url("    ");

이미지 주소는 상대 주소일 수도 있고 절대 주소일 수도 있다.요소에 배경 이미지를 설정하려면 요소의 너비와 높이가 있어야 배경 이미지가 표시됩니다.

배경 반복 스타일 background-repeat

은 CSS에서 background-repeat 속성을 사용하여 배경 이미지의 배열 여부를 설정할 수 있고 배열 방법을 설정할 수 있다.

background-repeat    :
no-repeat        
repeat         ，       （x ）     （y ）    
repeat-x           （x ）  
repeat-y           （y ）  

주의: 배경 그림이 있는 요소의 폭이 배경 그림 자체의 폭보다 크거나 높아야 배열 효과가 있습니다.

배경 그림 위치

배경 위치 속성은 배경 이미지의 위치를 설정하는데 이 속성은 블록 요소와 대체 요소에만 적용됩니다.그 중에서 교체 요소는 img, input, textarea, select과 object이다.

  ：background-positon:   /   ;
  ：          ，        ，         。

1, background-position에서 픽셀 값

background-position 수치가 픽셀 값인 경우 수평 방향 수치(x 축)와 수직 방향 수치(y 축)를 설정합니다.예를 들어'background-position：12px 24px;'은 배경 그림이 이 요소의 왼쪽 상단에 있는 수평 방향 위치는 12px이고 수직 방향 위치는 24px이다.이 두 수치 사이는 으로 구분해야 한다는 것을 주의하십시오.

2, background-position은 키워드

background-position         
      
top left      
top center      
top right     
left center     
center center     
right center        
bottom left   
bottom center       
bottom right      

은 background-position의 수치가 키워드일 때도 수평방향과 수직방향의 값을 설정해야 한다. 단지 값은 px 단위의 수치가 아니라 키워드로 대체해야 한다.