body
요소 가운데 가운데에 div
(#main
)이 있습니다. body
에는 가로로 반복되는 배경 이미지와 색이 요소의 왼쪽 상단에 정렬되어 있습니다. #main
은 고정 폭, 가변 높이 및 자체 배경 이미지 및 색상을 가지고 있습니다.가로로 백그라운드 첨부 파일을 사용하여 배경을 고정하는 방법
아래 그림과 같이 달성하고자하는 것은 의 내부 이미지를 body
의 배경 이미지에 맞춰 정렬하는 것입니다. 두 개의 배경 이미지가 비슷해 지므로 올바른 맞춤이 필요합니다.
나는 #main
의 배경 이미지에 background-attachment: fixed;
을 사용하려고 시도했으나 분명히 전체 배경 이미지가 페이지와 함께 스크롤되는 것을 제외하고는; 여기서 내가 배경으로 #main
의 배경이 body
의 것과 정확하게 정렬되어 있지만 수평으로 만 반복되고 사용자가 수직으로 스크롤 할 때 사용자를 따라 가지 않는 효과를 얻으려고합니다.
Demonstration http://img163.imageshack.us/img163/2783/bgfixedexample.png
는
나는 뒤늦은 생각에서 아주 어리 석다. '# main'이 수평 중심에 있다고 가정하면, "top center"의 배경 위치는 올바르게 정렬됩니다. 내 테스트 페이지에서 #main에 잘못된 마진이 있었고 중심에 있지 않았기 때문에 눈치 채지 못했습니다. –