2014-03-26 7 views
0

에 내 페이지의 배경으로 1900X1200 이미지를 사용하고 있습니다 :배경 이미지 커버 안드로이드 브라우저

    body{ 
        background: url(Layout/Ball7.png); 
        background-position: center center; 
        background-repeat:no-repeat; 
       -webkit-background-size: cover; 
       -moz-background-size: cover; 
       -o-background-size: cover; 
        background-size: cover;} 

그것은 모두 데스크톱 버전과 iOS 용 사파리 버전에서 전체 화면을 다룹니다. 이것은 안드로이드 네이티브 브라우저 (3 가지 다른 장치에서 시도했습니다)에서 화면의 위아래에 빈 흰색 영역을 남깁니다 (위아래에서 약 15 % 공백). background-position: center center;을 삭제하면 화면의 상단도 배경의 일부가되지만 여전히 페이지 하단에 빈 흰색 (apprx.15 %)이 나타납니다. 또한이 코드를 솔루션으로 사용하려고 시도했습니다.

height:100% width: 100%; 
height: 100%; 
position: fixed; 
top: 0; 
left: 0; 
z-index: 0; 

그러나 행운을하지 않으면 화면의 하단 부분이 덮히 지 않습니다. 내가 여기서 아무것도 놓치고 있니? 나는 많은 옵션을 시도했지만 아무도 정확하게 나의 요구에 맞지 않습니다.

가능한 해결책 : 매우 큰 이미지 (1900x2500)를 사용하려고했지만 전체 화면을 덮지 만이 솔루션이 최후의 수단이므로 1900x1200 이미지를 고집하고 싶습니다.

아무쪼록 감사드립니다.

답변

-2
body { 
    background: url(Layout/Ball7.png) no-repeat top left fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    height:100%; 
    margin:0; 
    padding:0; 
} 
+0

첫 번째 html 태그를 body 태그로 변경 한 경우에만 배경을 설정하지 않습니다. – Oranges

+0

이전 답변을 편집했습니다. Nexus 5의 Chrome에서 작동합니다. – AndrePliz

+0

안드로이드 네이티브 브라우저에서 코드를 사용하여 회신 해 주셔서 감사합니다. 화면 하단에 여전히 빈 흰색 영역이 있습니다 (전체 화면 중 15 %). 그 문제에 대한 더 많은 빛을 가져 주셔서 감사합니다. – Oranges

관련 문제