0
여기에서 질문을 받았지만 기존 질문 중 많은 부분이 구식 인 답변이 있습니다. 내가 필요로하는 것은 다음과 같다 : 고정되고 중심이 맞춰진 배경 이미지가있는 CSS와 HTML이 선호되는 웹 페이지. 내가 사용하고있는 배경 이미지의 크기는 1024x1024이며 이미지는 가로 및 세로 모드로 화면을 덮을 것입니다. 배경 이미지도 고정되어 있어야합니다. 즉, 페이지의 내용이 스크롤되면 배경 이미지가 내용과 함께 스크롤되지 않습니다.모바일 사파리 (iOS 5), 가로 및 세로의 고정 및 중앙에 위치 된 배경 이미지
나는 해결책을 가지고 그 거의 작품 :
CSS :
#background {
background-image: url('background.jpg');
background-position:center;
background-repeat: no-repeat;
width: 100%;
height: 100%;
position: fixed;
z-index: 0;
}
HTML :
<body>
<div id="background"></div>
<!-- content here -->
</body>
이 솔루션은 세로 모드에서 잘 작동; 고정 및 중심 모두 잘 작동합니다. 그러나 ipad를 가로 모드로 전환하면 배경 이미지가 즉시 새 너비를 채우기 위해 크기가 조정되지 않고, 오른쪽에 흰색 세로 줄무늬가 표시됩니다. 내용을 스크롤하면 배경 이미지의 크기가 조정되고 너비가 올바르게 채워집니다.
페이지 콘텐츠가 스크롤되었을 때 배경의 크기가 조절되는 이유를 아는 사람이 있습니까? 누구나 올바르게 작동하는 법을 아는 사람이 있습니까? 저는 iOS 5에서 작동하는 것에 만 관심이 있습니다. 따라서 다른 브라우저 나 iOS 4를 고려하지 않아도됩니다.