모바일이 매우 희미 해집니다 .
그러나 DevTools가 정확합니다 .
정말 이상하다, 고치는 방법?
.contact
padding: 80px 30px
color: #fff
background: #151515 url('../src/assets/images/about.jpg') no-repeat fixed left bottom
min-height: 100%
background-size: cover
position: relative
- 답변 # 1
- 답변 # 2
휴대 전화에서 배경 이미지가 올바르지 않습니다. CSS 배경 크기의 모바일 :
background-size: contain;
관련 자료
- css - 모바일에서 액세스 할 때 로고의 배경 이미지를 어떻게 변경합니까?
- html - 백그라운드에서 이미지를 캡처하고 PHP의 폴더에 저장
- html - 텍스트가 이미지 위에 애니메이션을 적용 할 수 있도록 배경 이미지에 녹아웃 텍스트를 만드는 방법
- reactjs - Express React (create-react-app)에서 프런트 엔드에 이미지를 올바르게 표시하기위한 올바른 이미지 경로
- html - 배경 - linear-gradient ()가 모바일에서 작동하지 않습니다
- html - 반응 형 이미지로 div 배경 채우기
- html - 태블릿/데스크톱에서는 이미지가 겹치지 않지만 모바일에서는 겹치지 않습니다
- html - 특정 div 내부의 텍스트와 배경의 이미지
- reactjs : 반응 스타일링을 사용하여 전체 창 배경 이미지 설정 방법
- html - 휴대 기기 스크롤시 배경 고정
- python - Tesseract OCR을 통해 검정색 배경 이미지에서 검정색 텍스트를 읽는 방법은 무엇입니까?
- react native - Material Top Tab Navigator에서 화면에 정적 배경 이미지를 추가하는 방법은 무엇입니까?
- ios - 애니메이션 popViewController 지연/지연을 유발하는 배경 이미지
- TYPO3 마스크 및 배경 이미지
- html - 자바 스크립트를 사용하여 배경 이미지로 캔버스 텍스트 그리기
- android - XML 파일에 배경 이미지를 어떻게 추가합니까?
- javascript - Cheerio/NodeJS는 div의 배경 이미지를 얻습니다
- JavaScript로 다운로드 한 캔버스 이미지의 배경색을 흰색으로 만들려면 어떻게해야합니까?
- css - 뷰포트와 관련된 SVG 배경 이미지
- c# - Xamarin에서 'ListView의 배경 이미지'를 수정하는 방법?
테스트 할 코드가 없다면 문제는
fixed에서 비롯된 것 같습니다 속성 : https://developer.mozilla.org/en-US/docs/Web/CSS/background-attachment제거하면 뷰포트에 맞는 이미지를 표시하고 표시 할 수없는 부분을 자릅니다. 이미지가 뷰포트보다 훨씬 크기 때문에 고정을 사용하면 현재 뷰포트에 맞는 이미지 부분이 표시됩니다.
시도해보십시오 :