끈적한 바닥 글이있는 그라디언트 배경

흰색 배경에서 시작하여 페이지 하단에 회색으로 끝나는 그라데이션을 추가하려고합니다. 페이지에 끈적 끈적한 꼬리말이 있기 때문에 내용이 브라우저 창보다 크면 본문은 내용과 함께 늘이거나 확장되지 않습니다. 그래디언트가 중간에 멈 춥니 다. 누군가 제발 도와 줄 수 있니?끈적한 바닥 글이있는 그라디언트 배경

HTML :

<html> 
    <body> 
     <div class="content"> </div> 
     <div class="footer"> </div> 
    </body> 
</html>

CSS :

html { 
    height:100%; 
} 
body { 
    height:100%; 
    background: -moz-linear-gradient(top, #fff 0%, #d5d6db 100%); 
} 
.content { 
    min-height: 100%; 
}  
.footer { 
    height: 55px; 
}

출처

2012-01-24 Nathasha Loos

background-attachment : fixe 디;

본문에 추가하십시오. CSS.

이미 알고 계시 겠지만 background: -moz-linear-gradient(top, #fff 0%, #d5d6db 100%);은 IE에서 작동하지 않습니다. 이 속성은 Mozilla 기반 브라우저에만 해당됩니다.

크로스 브라우저 CSS 그라데이션 ... 크기 대신 100 % 자동으로 설정됩니다 http://webdesignerwall.com/tutorials/cross-browser-css-gradient

출처

2012-01-24 01:18:56

감사합니다 움큼! background-attachment : 트릭을 수정했습니다. 그래디언트에 대해이 게시물의 코드를 분명하게 만들고 싶었습니다. 다시 한 번 감사드립니다 :) –

NICE one! 내 머리를 고쳤다. – neokio

당신은 내 영웅입니다. –

그냥 자동차에 몸 CSS를 htmland 설정 및 바디 배경 그라데이션에서 크기를 제거해야

- 참조 : http://jsfiddle.net/ZqkY7/

출처

2012-01-24 01:18:08 sanusart

, 바닥 글 하단에 충실하지 않을 것입니다. 레오 하리스 (Leo Haris)가 아래에서 제안했듯이 "\t 배경 부착 : 고정"이 문제를 해결했습니다. 도와 주셔서 감사합니다 :) –

끈적한 바닥 글이있는 그라디언트 배경

답변

관련 문제