在凌乱的代码周围硬包装div

时间:2011-11-18 16:20:49

标签: jquery html css coldfusion

我有一个页脚,并希望通过将内容包装在min-height: 100%的div中来做好老式的“将页脚保持在底部无论如何”,使页脚绝对位于底部容器。我的问题是,大多数文件看起来像这样:

<cfinclude template="header.cfm" />
<cfinclude template="some-content.cfm" />
<cfinclude template="footer.cfm" />

这似乎很容易,只需打开标题中的容器div并在页脚中关闭它。然而,在这个已有12年历史的应用程序中,到处都有无数的非封闭div和随机标签。因此,在尝试包装sucker时,div在某些时候被抛出之前不会完全通过代码。

所以问题是:是否有更快乐的方法将页脚保持在底部(我可以在jQuery中执行此操作,计算窗口高度和html高度等等,如果可能的话,我真的在寻找一些不那么混乱的东西)或者有没有人知道一种晦涩的方式强迫关闭div标签与它的开启者联系?

2 个答案:

答案 0 :(得分:1)

您无需计算窗口高度或将所有内容包装在容器中以使页脚保持在底部。在html的开头或结尾创建一个带有页脚内容的div,并使用position: fixed; bottom: 0使其保持在底部(如果您不希望它与内容重叠,也可以向主体添加一些填充) 。如果您需要支持较旧的IE,请使用position: absolute并添加一些Javascript以在页面滚动时重新定位它 - 互联网上有很多关于此的示例(以下是rip747提供的示例:{ {3}})

编辑:考虑到第一条评论,您还可以在希望页脚保持使用jQuery的元素之后添加div。通过在加载dom之后添加它,不存在未闭合元素的问题。

答案 1 :(得分:1)

如果这是一个古老的应用程序,则不太可能使用任何新的HTML5元素,因此您可以将所有内容包括在内,例如<article>而不是<div>

这个想法有点脏,除非你能找到一个很好的语义匹配。 Draevor是对的,还有其他方法可以将内容粘贴到页面底部。

修改:New HTML5 elements