CSS页脚固定宽度，屏幕底部和居中

Question

我主要是iPhone开发人员，我对CSS有点垃圾，我正在尝试为我的应用程序制作一个网页。

我想让我的页脚具有以下属性：

• 固定宽度为640px
• 居中
• 附在屏幕的底部，而不是页面。因此，当用户调整窗口大小时，页脚始终位于底部

我自己可以做的所有其他造型，只是位置造型，我觉得很难。

有人可以向我解释如何在CSS中执行此操作。

Answer 1

footer {
    width: 640px;
    margin: 0% -320px;
    position: fixed;
    left: 50%;
    bottom: 0%;
}

示例：http://jsbin.com/imisig/3

大量文字示例：http://jsbin.com/imisig/4

Answer 2

将页脚HTML放入<div id="footer">。 CSS就是这样的：

#footer {
    width: 640px;
    position: fixed;
    bottom: 0px;
    left: 50%;
    margin-left: -320px;
}

解释

• width属性将宽度设置为640px
• position: fixed将使其滚动页面
• bottom: 0px将其固定在页面底部（距离底部= 0px）
• left: 50%将div的左侧放在页面的中心
• margin-left: -320px - 现在我们必须将它从左侧移动320px以使其居中