background-attachment : 모바일에 고정 됨

spn 웹 응용 프로그램의 배경 이미지를 설정하려고하는데 배경을 고정해야합니다 (페이지의 나머지 부분과 함께 스크롤되지 않습니다). 안드로이드에 background-attachment : 모바일에 고정 됨

body { 
    background-color: rgb(51, 102, 102); 
    background-image: url('../images/background.png'); 
    background-attachment: fixed; 
    background-position: center; 
    color: #eee; 
}

사파리 IOS와 크롬에서

한 시점에서 고정 대신 배경을 반복 :

이

은 신체의 CSS입니다.

인터넷에서 모바일에서 사용 중지 된 적이 있지만 해결 방법이 있습니까?

출처

2016-12-16 Gil

background-repeat: no-repeat; 
background-position: center center;

출처

2016-12-16 19:01:24 oompahlumpa

이렇게하는 데는 다른 옵션이 있지만 이것은 실제로 나를 위해 일한 유일한 옵션입니다. 그리고 나는 그들 모두에 관해서 노력했다.

div는 초기 태그 바로 아래에 설정합니다. 그런 다음 이미지를 div 내의 html에 적용합니다. div 및 id 속성도 지정하십시오 (이 경우 #background_wrap). ... 나는 html 내에서 실제 이미지 링크를 적용하지 않고 이것을 시도했지만 css 내에서 배경에 이미지를 적용 할 때 여전히 "background-image :"속성을 사용해야하기 때문에 제대로 작동하지 않았습니다. 모바일 장치에서이 작업을 수행하는 트릭은 배경 이미지 설정을 사용하지 않습니다. 이 값들은 내 프로젝트에만 적용되었지만 고정 된 배경 이미지가 모바일 및 대형 컴퓨터 뷰포트의 중앙에 배치되고 반응이 잘 유지되도록 완벽하게 작동했습니다. 특정 프로젝트에 약간의 값을 조정할 수도 있지만 그만한 가치가 있습니다! 이게 도움이 되길 바란다.

<body> 
    <div id="background_wrap"><img src="~/images/yourimage.png"/></div> 
</body>

그런 다음 CSS에서 이러한 설정을 적용하십시오.

#background_wrap { 
margin-left: auto; 
margin-right: auto; 
} 
    #background_wrap img { 
     z-index: -1; 
     position: fixed; 
     padding-top: 4.7em; 
     padding-left: 10%; 
     width: 90%; 
    }

출처

2017-04-12 04:36:40

background-attachment : 모바일에 고정 됨

답변

관련 문제