当前位置: 首页 > 面试题库 >

如何将页脚保持在屏幕底部

单于经纬
2023-03-14
问题内容

设置网页的最佳做法是什么,以便在该网页上显示的内容/文本很少的情况下,页脚显示在浏览器窗口的底部,而不是显示在网页的中途?


问题答案:

您正在寻找的是 CSS Sticky Footer

* {

  margin: 0;

  padding: 0;

}



html,

body {

  height: 100%;

}



#wrap {

  min-height: 100%;

}



#main {

  overflow: auto;

  padding-bottom: 180px;

  /* must be same height as the footer */

}



#footer {

  position: relative;

  margin-top: -180px;

  /* negative value of footer height */

  height: 180px;

  clear: both;

  background-color: red;

}





/* Opera Fix thanks to Maleika (Kohoutec) */



body:before {

  content: "";

  height: 100%;

  float: left;

  width: 0;

  margin-top: -32767px;

  /* thank you Erik J - negate effect of float*/

}


<div id="wrap">

  <div id="main"></div>

</div>



<div id="footer"></div>


 类似资料:
  • 问题内容: 当我有一个页面可以通过CSS动态设置高度(例如,从数据库获取信息)时,如何将页脚div始终保持在窗口底部? 如果您想使用jQuery,我想出了这一点并且效果很好: 设置页脚的CSS: 设置脚本: 该脚本必须位于代码的末尾。 问题答案: 我相信您正在寻找 粘性页脚 从上面的文章: layout.css: html页面:

  • 问题内容: 我需要保持页脚在底部,但其高度可变,因此主要解决方案不适合我… 任何人都可以使用灵活的页脚解决方案? 问题答案: :解决此布局问题的现代方法是使用CSS模型。所有主流浏览器和IE11 +均支持该功能。 这是使用带有的s 的灵活高度的粘性页脚的解决方案: 需要注意的是CSS是设计用于布局 文档的 ,而不是Web应用程序屏幕的。CSS display:table属性虽然非常有效,并且在所有

  • 在 一到三个 。有没有办法在后始终将单元格放置在屏幕底部?

  • 问题内容: 我找到了几种解决方案,如何在Java中做到这一点,但没有找到如何在QML或Qt中做到这一点。我知道首先我应该在中设置许可。我应该怎么做才能在运行时从Qt打开和关闭屏幕锁定? 问题答案: 您可以使用Qt Android Extras模块并使用JNI从C ++调用相关的Java函数。就像是 :

  • 问题内容: 我在浏览器底部放置页脚时遇到了经典问题。我尝试过包括在内的方法,但效果不佳:我的页脚始终始终显示在FF和FF中的浏览器窗口中间IE浏览器 在HTML中,我得到了这个简单的结构 这是与css页脚问题相关的css代码: 我在哪里做错了?我真的已经尝试了一切。如果我错过了任何有用的信息,请告诉我。 谢谢您提前提出任何建议。 问候, 谢谢大家的答案。它适用于: 设置位置:固定由于某种原因在IE