배경 이미지 반복

1. 배경 이미지의 크기가 배경을 채우려는 요소보다 작은 경우; 기본적으로는 가로/세로로 반복해서 채워진다(기본값 repeat)

background-image: url("_images/남산부석.jpg");

배경 이미지의 크기가 배경을 채우려는 요소보다 작은 경우; 기본적으로는 가로/세로로 반복해서 채워지는데(기본값: repeat), background-repeat 속성에 round 값을 주어 이미지가 잘리지 않게 크기를 조절하여 반복하거나, space 값을 주어 끝에서 끝까지 고르게 분배해줄 수도 있다. 또는, background-repeat: repeat-x/y; 값을 주어 원하는 반복 방향을 지정해주거나 no-repeat 값을 주어 반복하지 않도록 설정해줄 수도 있다:

2. 배경 이미지의 크기가 배경을 채우려는 요소보다 작은 경우; background-repeat 속성에 round 값을 주어 이미지가 잘리지 않게 크기를 조절하여 반복하거나, space 값을 주어 끝에서 끝까지 고르게 분배해줄 수도 있다:

background-image: url("_images/남산부석.jpg"); background-repeat: round;

background-image: url("_images/남산부석.jpg"); background-repeat: space;

3. 배경 이미지의 크기가 배경을 채우려는 요소보다 작은 경우; background-repeat: repeat-x/y; 값을 주어 원하는 반복 방향을 지정해주거나 no-repeat 값을 주어 반복하지 않도록 설정해줄 수도 있다:

background-image: url("_images/남산부석.jpg"); background-repeat: no-repeat;