2012-06-25 5 views
2

나는이 CSS가 : 나는 창을 최대화하면CSS 본체 고정 배경

body 
{ 
    background-position: center top; 
    background-color: rgb(237, 237, 237); 
    font-size: .85em; 
    font-family: "Trebuchet MS" , Verdana, Helvetica, Sans-Serif; 
    margin: 0px auto; 
    padding: 0; 
    color: #696969; 
    width: 1000px; 
    height: 1200px; 
    background-image: url('Background.png'); 
    background-repeat: no-repeat; 
    background-attachment: inherit;  
    top: 0px; 
} 

은 모든 괜찮아을하지만 난 창을 작게 만들 경우, 배경 이미지로 이동합니다.

This is how look in maximizedbrowser window

And this is after change window size

답변

0

당신이 사람들로부터 얻을 것이다 대부분의 답변은 IE9 + (이 때문에 CSS3)가 필요합니다. 그러나 사용자가 구형 브라우저를 사용하기를 원한다면 (여기서는 실용적이고 안전합니다.)이 작업을 수행하는 방법은 jQuery/JavaScript를 사용하는 것입니다. 나는 CSS3에서 과거와 비슷한 것을했지만, 나중에 대부분의 회사/회사가 여전히 IE8을 사용하고 있으며 JavaScript를 사용하는 가장 좋은 방법은 IE8을 사용한다는 것을 깨달았습니다.

  1. http://buildinternet.com/project/supersized/slideshow/3.2/demo.html (이 좋은 예이다) 이와
  2. http://designshack.net/?p=13616
  3. http://css-tricks.com/examples/FullPageBackgroundImage/jquery.php
0

TRY이 :

-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover; 
background-size: cover; 
background-position:fixed; 
+0

문제가 해결로 설정하면 DOM 소요된다 : 여기

몇 예 요소를 정상 위치에서 벗어나므로 '덮개'는 요소가 아닌 몸체에 적합합니다. 아직 수정 사항을 찾을 수없는 것 같습니다. – Carson

0

음 우선, 다음과 같은 가능한 경우 그룹화하여 CSS 속성에 시도 :

body { 
width: 1000px; 
height: 1200px; 
background: #EDEDED url('Background.png') center top inherit no-repeat; 
top: 0; 
margin: 0 auto; 
padding: 0; 
font: .85em "Trebuchet MS" , Verdana, Helvetica, Sans-Serif; 
color: #696969; 
} 

또한 수 문제에 jsFiddle을 제공하여 코드의 전체 또는 페이지에 대한 링크를 볼 수 있습니까?

http://jsfiddle.net/

감사