> 웹 프론트엔드 > CSS 튜토리얼 > iOS 7에서 흐린 배경 이미지를 수정하는 방법은 무엇입니까?

iOS 7에서 흐린 배경 이미지를 수정하는 방법은 무엇입니까?

Susan Sarandon
풀어 주다: 2024-12-11 16:18:11
원래의
718명이 탐색했습니다.

How to Fix Blurry Background Images on iOS 7?

iOS 7에서 수정된 배경 이미지 문제

고정된 배경 이미지를 구현하면 iOS 7, 특히 iPad에서 문제가 발생할 수 있습니다. 확대되고 흐릿한 이미지. 이 문제를 해결하려면 다음 CSS 코드를 검토하세요.

.header {
  display: table;
  height: 100%;
  width: 100%;
  position: relative;
  color: #fff;
  background: url(../images/boston2.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
로그인 후 복사

가능한 해결 방법:

  • '배경 첨부: 스크롤' 사용: 이미지가 고정되는 것을 방지하지만 최소한 표시할 수는 있습니다.
  • 미디어 쿼리 구현: 다음과 같은 미디어 쿼리를 사용하여 고정된 백그라운드 동작을 태블릿이나 휴대폰이 아닌 장치로 제한합니다.
@media screen and (max-device-width: 1024px) {
  .header {
    background-attachment: scroll;
  }
}
로그인 후 복사
  • '배경 위치: 스크롤' 및 JavaScript 활용: 이미지를 창 상단에 고정 유지 JavaScript를 사용합니다.

이러한 솔루션을 고려하면 iOS 7에서 문제 없이 고정된 배경 이미지를 효과적으로 표시할 수 있습니다.

위 내용은 iOS 7에서 흐린 배경 이미지를 수정하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿