css - 如何在不使用 javascript 的情况下使页脚始终位于 Sharepoint 2013 的页面底部？

Question

我正在为公司客户制作 SharePoint UI 品牌。大多数客户希望将页脚始终放在页面底部(不粘)。当内容较多时，它会自动移至底部，但如果内容较少，我想将页脚保留在屏幕底部。在普通的 HTML 页面中，我可以使用 CSS 实现这一点。但到目前为止，我在 SharePoint 中使用 javascript 来解决这个问题。

有什么方法可以在 SharePoint 2013 中仅使用 CSS 来解决这个问题？

Answer 1

此解决方案与向 HTML 页面添加粘性页脚基本相同(如 here 所述)，只是在SharePoint 2013 中的 seattle.master 文件。

粘性页脚是通过使用 div 标记向页面添加 3 个部分(包装器、推送和页脚)来创建的。 push 紧跟在 s4-workspace div(主要内容区域)之后，wrapper 包围主要内容区域和推。 footer 紧跟在 wrapper div 的结束标记之后。

需要以下 CSS 来格式化新的 div。

.wrapper {
  min-height: 100%;
  height: auto !important;
  height: 100%;
  margin: 0 auto -4em;
}
.footer, .push {
  height: 4em;
  clear: both;
}

需要注意的几点是footer 和push 的高度必须相同，并且clear property with value of both确保页脚在多列布局中延伸到整个页面。

This是一篇关于在 SharePoint 2013 中添加粘性页脚的精彩文章。