当 p:layout 的 fullPage 设置为 false 时，在 PrimeFaces 模板中显示页脚 [英] Display footer in PrimeFaces template, when fullPage of p:layout is set to false
本文介绍了当 p:layout 的 fullPage 设置为 false 时，在 PrimeFaces 模板中显示页脚的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
<p:layoutUnit position="north" size="135"><!--如果有的话，把北方的内容放在这里--></p:layoutUnit><p:layoutUnit position="west" size="225" header="Menu Item" collapsible="true"><!--如果有的话，把西方的内容放在这里--></p:layoutUnit><p:layoutUnit position="center" size="2500" maxSize="2500"><!--如果有的话，把中心内容放在这里--></p:layoutUnit><p:layoutUnit position="east" size="175"><!--如果有的话，把东方的内容放在这里--></p:layoutUnit><p:layoutUnit position="south" size="90"><!--将南/页脚内容放在这里，如果有的话--></p:layoutUnit></p:layout> 当fullpage设置为false时，如何显示页脚?
如果
<p:layout fullPage="false" style="height: 2000px;">然后页脚会根据 height CSS 属性的值显示在页面底部，但 它仍然不是粘性页脚 - 它不会调整根据页面内容.
那么，有没有办法让它变得粘稠?
<小时>更新:
行为在 PrimeFaces 5.3 final(社区发布)，当 fullPage 设置为 false 时，如前面在整个问题中所述.
解决方案
为了轻松地可视化您最终需要什么(并确认您自己的需求)，这里是 SSCCE 风格的纯 HTML/CSS 解决方案(显然)要求.粘性页脚解决方案主要基于 Ryan Fait 的方法(min-height:100% 和容器元素上的负边距，它覆盖了除页脚之外的所有内容)，它只是不再支持 IE6/7(由于 :after 伪选择器)，从而简化了 HTML 标记(不需要像 <div id="pushfooter"> 这样的非语义混乱).注意:背景颜色纯粹是为了可视化.
<html lang="zh-cn"><头><title>堆栈溢出问题 22584920</title><风格>html，正文{高度:100%；最小宽度:800px；边距:0；}#容器 {最小高度:100%；边距:0 自动 -90px；/* #footer.height 的负数 */}#header {高度:135px；背景:粉红色；}#菜单 {向左飘浮;宽度:225px；背景:卡其色；}#内容 {左边距:225px；/* 与#menu.width 相同 */右边距:175px；/* 与#side.width 相同 */背景:柠檬雪纺；填充:1px 1em；/* 修复了 div 上 p 的折叠边距，可以随意删除它 */}#边 {浮动:对；宽度:175px；背景:淡绿色；}#footer, #container:after {高度:90px；}#页脚{背景:橙色；}.clearfix:后{显示:块；内容: " ";清楚:两者；}</风格><身体><div id="container" class="clearfix"><div id="header">页眉</div><div id="菜单">菜单</div><div id="side">Side</div><div id="内容"><p>内容</p><p>内容</p><p>内容</p><p>内容</p><p>内容</p><div id="footer">页脚</div>