使用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放置在你想要的位置。

祝你好运。