배경 이미지가 흐릿한 모바일 ios

이것은 신참 질문 일 수 있습니다. 그러나 내가 가지고있는 문제에 대한 해결책을 찾을 수없는 것 같습니다. 내 웹 사이트에는 어떤 화면 크기에서도 데스크탑에서 완전히 렌더링되는 배경 이미지가 있지만 모바일에서 볼 때 흐린 혼란이 있습니다. 나는 대답이 없거나 나에게 도움이되지 않는 해결책이있는 비슷한 질문들을 보았다.
Here is the website

다음은 내가 겪고있는 몇 가지 스크린 샷입니다. 그리고 여기 내 코드가 있습니다.배경 이미지가 흐릿한 모바일 ios

<div class="jumbotron"> <h1 class="text-center" id="head">Kyle Goode</h1> <p class="text-center" id="header">Full Stack Web Developer</p> </div> </div>

당신의 CSS의 중심 위치를 포함하고 도움이되는지 확인

.home { 
    background: url(http://mrg.bz/VN5LDd) fixed no-repeat center; 
    background-attachment: fixed; 
    background-size: cover !important; 
    max-width: 100%; 
    height: 900px; 
    border-top: 1px solid black; 
    border-bottom: 1px solid black; 
}

출처

2016-06-28 kgoode517

편집 : Valentino Kožinec이 맞습니다. 고정 및 커버로 IOS 문제가있는 것으로 보입니다. 이것에

변경 .home :

.home { 
    background: url(http://mrg.bz/VN5LDd) no-repeat center;

및 제거는

background-attachment: fixed;

이 작동하는 것 같다.

Doctype 및 head 태그가 있고 본문에 다시 태그가 있습니다. 이로 인해 문제가 발생할 수 있습니다. 한 번보기 가치.

이 복사하여 귀하의 사이트에서 여기에 붙여 : 대답에 대한

<!DOCTYPE html> 
<html > 
    <head> 
    <meta charset="UTF-8"> 
    <title>Portfolio </title> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 



     <link rel="stylesheet" href="css/style.css"> 




    </head> 

    <body> 

    <!DOCTYPE html> 
<html lang="en"> 

<head> 

    <!--Meta --> 
    <title>Goode Web Development</title> 

    <meta charset="utf-8"> 

    <meta name="viewport" content="width=device-width, initial-scale=1"> 

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css"> 

<link rel="stylesheet" href ="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 


    <link href='https://fonts.googleapis.com/css?family=Montserrat:700,400' rel='stylesheet' type='text/css'> 

    <link href='https://fonts.googleapis.com/css?family=Roboto:300italic' rel='stylesheet' type='text/css'> 

<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script> 

    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> 



</head>

출처

2016-06-30 02:43:24

제이슨 감사합니다. 머리말을 지적 해 주셔서 고맙습니다. – kgoode517

문제 없습니다. 다행스럽게 도울 수있어! –

보십시오. 함께를 사용하는 동안 덮개를 고정 배경 - 크기 : 당신은 아마 배경-위치에 문제가

이미 스택에 유사한 응답이

background-position: center center;

출처

2016-06-28 18:30:27 Hemchand

감사하지만 아무 효과가없는 것으로 보인다. – kgoode517

. 첫번째 것을 제거하고 문제가 아직 있는지보십시오.

.home 클래스에 대한 미디어 쿼리를 작성하고 잘린 이미지 나 다른 해결 방법을 넣을 수 있습니다.

출처

2016-06-28 19:29:53

Valentino를 찾아 주셔서 감사합니다! 나는 당신이 말하고있는 질문을 읽었지 만 배경 부착은 고정되어 있지 않고 고정되어 있습니다. 내가 사용한 배경 위치는 Hemchand가 권고 한 중심점입니다. 배경 첨부 파일을 삭제해도 배경 이미지의 흐려짐에는 아무런 영향이 없습니다. – kgoode517

배경 이미지가 흐릿한 모바일 ios

답변

관련 문제