높은 dpi 미디어 쿼리가 원본 CSS를 다시 작성하지 않음

Question

내 웹 사이트의 스타일을 지정하는 중이고 웹 사이트를 선호하기 때문에 높은 dpi 디스플레이에 미디어 쿼리를 사용할 예정 이었지만 미디어 쿼리 브라우저가 내 망막 맥북에 코드를 생성하는 것을 볼 때 미디어 본문에있는 코드 대신 기본 CSS가 여전히 있음을 알 수 있습니다. 왜 그런가요? 거기에 추가해야 할 것이 있습니까? 기본 CSS와 미디어 쿼리가 모두 동일한 CSS 파일에 있음을 유의하십시오. 그러나 문제는 아닌 것 같습니다.

/* ========================================================================== 
    Theme Style 
    ========================================================================== */ 

body { 
    background-color: #ebebeb; 
    /* background-image: url("../images/bg.png"); */ 
    background-image: url("http://bit.ly/Z1zQeb"); 
} 

/* ========================================================================== 
    Media Queries 
    ========================================================================== */ 

@media 
(-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 192dpi) { 

    /* background-image: url("../images/bg_@2X.png"); */ 
    background-image: url("http://bit.ly/ZgBQ4c"); 
    background-size: 147px 147px; 

} 

---

편집 :가 나는 또한 콘솔에서이 오류를 받고 있어요 : INDEX_SIZE_ERR: DOM Exception 1: Index or size was negative, or greater than the allowed value.

Answer 1

당신은 스타일을 적용 할 수있는 태그를 지정하지 않았습니다. 이 시도.

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { 
    body { 
     /* background-image: url("../images/bg_@2X.png"); */ 
     background-image: url("http://bit.ly/ZgBQ4c"); 
     background-size: 147px 147px; 
    } 
}