【问题标题】:How to create an HTML CSS Page with Header, Footer and Content如何创建带有页眉、页脚和内容的 HTML CSS 页面
【发布时间】:2010-09-27 04:08:11
【问题描述】:

页面有 3 个部分。

  1. 标头,在设计时具有未知内容,因为它在运行时填充了文本。必须显示所有文本,没有滚动条。(我认为height: 100% 这样做)

  2. 内容,内容应填满页面下方的页眉底部到页脚顶部。如果内容中有更多可以显示的文本,则应该可以使用滚动条。

  3. 页脚。页脚应为25px 高且始终位于视口底部。

窗口是一个弹出窗口,它不应该有窗口滚动条,它可以调整大小但没有滚动条。内容滚动条应该是唯一可用的。

调整窗口大小时内容区域应该调整大小,但页脚保持不变,即固定在底部。

宽度都是100%

【问题讨论】:

  • 嗯,听起来不错...有问题吗?
  • 编辑您的帖子并提出问题。这不是一个“现在就为我做这一切”的网站。我们可以帮助您解决问题,但您必须告诉我们您需要什么帮助。
  • 在关闭它之前给他一些时间来认识到他的错误。
  • 它在关闭时是可编辑的。我认为这是一个开放的问题没有任何好处...尤其是当它不是一个问题时。
  • 哦,来吧,伙计们......对于这个非问题有一个非常简单的“通灵答案”。拒绝回答只是迂腐。考虑我告诉姐姐“我没带手表”……正确答案是“现在是 9:30”

标签: css dhtml


【解决方案1】:

标题:不指定高度。 div 会自动调整到其内容的高度

内容:指定一个margin-bottom:25px以避免被页脚重叠

页脚:位置:固定;高度:25px

您必须研究模拟 position:fixed for IE

How do I get a floating footer to stick to the bottom of the viewport in IE 6?

【讨论】:

    【解决方案2】:

    如果您希望页脚位于窗口底部,这可能会让人头疼。我发现这样做并使其跨浏览器工作的唯一方法是使用可怕的表格布局 - 在我把头咬掉之前,表格布局是不受欢迎的 - 很重要。

    定位页眉和内容很容易......但据我所知,到目前为止,不是页脚,我只找到了两种将页脚定位在窗口底部的方法(相反到文档的底部,对于短文档,可能是窗口的一半),1 使用 Javascript 来引用 Window.Height 和其他使用表格(不赞成,但这样做的简单方法)。

    到目前为止,我还没有看到在所有浏览器中都能可靠地做到这一点的 CSS。我很想看到一个 CSS 做到这一点......

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2023-03-28
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-12-22
      • 2020-07-29
      • 1970-01-01
      相关资源
      最近更新 更多