漸變背景與粘性頁腳

我正在嘗試將漸變添加到從白色開始並以頁面底部的灰色結尾的正文背景中。由於頁面有一個粘滯的頁腳，當內容大於瀏覽器窗口時，主體不會隨內容一起展開/展開。所以漸變停在中間。有人可以幫忙嗎？漸變背景與粘性頁腳

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 d;

將此信息添加到您的文本CSS。

在旁註中，您可能已經知道這一點，但：background: -moz-linear-gradient(top, #fff 0%, #d5d6db 100%);在IE上不起作用。此屬性僅適用於基於Mozilla的瀏覽器。

跨瀏覽器的CSS漸變...... http://webdesignerwall.com/tutorials/cross-browser-css-gradient

來源

2012-01-24 01:18:56

謝謝！背景附件：固定的伎倆。關於漸變，我只是想讓這個帖子的代碼清晰。再次感謝:) –

好一個！ '固定'我的頭痛。 – neokio

你是我的英雄。 –

你只需要身體CSS設置htmland自動並從身體背景漸變尺寸 - 見：http://jsfiddle.net/ZqkY7/

來源

2012-01-24 01:18:08 sanusart

當大小設置爲auto，而不是100％，頁腳不會粘在底部。正如Leo Haris在下面建議的，「\t background-attachment：fixed」給身體解決了問題。感謝您的幫助:) –

漸變背景與粘性頁腳

回答

相關問題