使用CSS和960gs的頁腳定位

Question

我是新來的使用CSS做佈局（我很久沒有做過任何網頁設計了），我似乎無法弄清楚如何獲取頁面的頁腳以我想要的方式在底部顯示。

要求： - 如果內容超過視口的垂直尺寸，則顯示在內容底部 - 如果視口超過內容的垂直尺寸，則在視口底部顯示。

我正在使用的代碼將頁腳設置在視口的底部，但是如果我將瀏覽器的大小設置爲小於內容，則只會覆蓋內容。

代碼： <div style="background-image:url(footer_bg.jpg); background-position:bottom; background-repeat:repeat-x; height:235px; width:100%; bottom:0px; position:absolute;"></div>

我的主要目標就是與文本頁腳和背景梯度（即公司的信息，聯繫信息）。我希望頁腳背景能夠跨越頁面的寬度，但我不知道我是否可以用960 gs div做到這一點。

編輯：我想這樣做所有的CSS，如果可能的話沒有腳本。
我發現了一些好的代碼在這個環節得到一個CSS頁腳：
http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page

主要的問題我遇到現在在執行與960gs是在960gs CSS的float:left;。它似乎阻止了我的網格垂直擴展父項<div>。但是，如果我刪除浮動，960gs似乎不起作用。

以下是刪除浮動鏈接。 'a'列是grid_7 suffix_1，'b'列應該是grid_4在相同的container_12。換句話說，他們應該是彼此相鄰的。

Answer 1

看一看CSS Sticky Footer。它完全用純html/css完成，根本沒有腳本。有一個解釋如何讓它與960gs在signalkraft.com工作。

希望這會有所幫助。

Answer 2

在CSS中，沒有「if/else」的能力。這是腳本語言進來的地方。

查找JQuery。在jQuery中，你可以抓住與#ID頁腳的元素，這樣說：

$('#footer').addClass('bottomView'); 

「bottomView」可以讓這個與ID頁腳粘到視口底部的元素。然後，當用戶滾動時，哪個JQuery可以監視，它可以檢查是否要將該類更改爲「bottomContent」。

然後在你的CSS中，只需將bottomView和bottomContent放置在你想要的位置。

祝你好運。