2014-05-12 2 views
1

모든 것이 너무 바빠서 화면 크기/해상도가 작아짐에 따라 배경 이미지가 사라 지려고합니다.화면이 작을 때 bg 이미지가 사라지려고합니까?

저는 기본적인 HTML 기술과 기본적으로 CSS 지식이 없습니다.

문제가 복잡해지기 위해 Big Cartel에 약간 수정되었습니다. 현재 내 배경에 대한 코드는 다음과 같습니다.

body { 
    background-repeat: no-repeat ; 
    background-image: url("http://dl.dropbox.com/u/19831829/Sour%20Milk%20Website/sidework copyR.png"), url("http://dl.dropbox.com/u/19831829/Sour%20Milk%20Website/sideworkL.png"); 
    background-attachment: fixed; 
    background-position: left, right 
} 

미디어 문의 (?)를 조사했지만 제대로 작동하지 않았습니다.

나는 도움을 주시기 바랍니다. 나는 당신에게 내가 당신을 제공하게되어 기꺼이 더 많은 코드를 볼 필요가 있다고 가정한다. 또한 문제 해결을위한 무료 티를 나눠 줄 수 있습니다.

+1

jsfiddle를 제공 ​​할 수 있습니까? http://www.jsfiddle.net –

답변

2

시도 이하.

body { 
    background-repeat: no-repeat ; 
    background-image: url("http://dl.dropbox.com/u/19831829/Sour%20Milk%20Website/sidework copyR.png"), url("http://dl.dropbox.com/u/19831829/Sour%20Milk%20Website/sideworkL.png"); 
    background-attachment: fixed; 
    background-position: left, right 
} 
/** 
* Remove background if window width is 6OOpx or less 
*/ 
@media all and (max-width: 600px) { 
    body { 
    background: none; 
    } 
} 

근무 예 : http://codepen.io/anon/pen/sfLmo

건배 (테스트하는 브라우저의 크기를 조정).

+0

건배! 치료를해라. 만약 당신이 티를 원한다면 나에게 알려 주어서 고맙다. – user3628175

1

여기에 CSS의 예는 브라우저 창 600PX 폭 때 배경이 이동하게하는 미디어 쿼리와 함께입니다, 아마 당신은 미디어 쿼리 올바른 방법을 포함하고 있지 않습니다

@media only screen and (max-device-width :700px) { 
    body{ 
    background:none; 
    } 
} 
@media only screen and (min-device-width: 701px) { 
    body { 
    background-repeat: no-repeat ; 
    background-image: url("http://dl.dropbox.com/u/19831829/Sour%20Milk%20Website/sidework copyR.png"), url("http://dl.dropbox.com/u/19831829/Sour%20Milk%20Website/sideworkL.png"); 
    background-attachment: fixed; 
    background-position: left, right 
} 
} 
관련 문제