javascript - 使用 mmenu 时无法添加页脚

标签 javascript jquery css mmenu

我有一个问题。在对站点的侧页进行编码时,我无法将页脚绑定(bind)到站点的地下室。我使用 Bootstrap 类。尝试使用此类代码时:

html {
  position: relative;
  min-height: 100%;
}
body {
  /* Margin bottom by footer height */
  margin-bottom: 60px;
}
#footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 60px;
  background-color: #f5f5f5;
}

页脚要么保留在原位,要么关闭内容,接近导航栏。 如何解决这个问题?

之前 /image/qeg7Q.png

使用代码后 /image/XnnaS.png

附言我为糟糕的英语道歉

最佳答案

100% 的高度与您想象的不同。在这种情况下,您正在寻找 vh 单位。我还将它们应用于 body,而不是 html

*{box-sizing: border-box;}

body {
  /* Margin bottom by footer height */
  margin: 0;
  padding: 0;
  min-height: 100vh;
  position: relative;
}
footer {
  position: absolute;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 60px;
  background-color: #f5f5f5;
  bottom: 0;
}
<body>
  content
  <footer>
    footer
  </footer>
</body>

关于javascript - 使用 mmenu 时无法添加页脚,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43526715/

相关文章:

javascript - 使用字节的 AWS Rekognition JavaScript SDK

javascript - 可以通过提交按钮将用户提交的标记添加到传单 map 中吗?

css - 压缩 css 文件导致 glyphicon 字体无法呈现 : Resources interpreted as Font but transferred with MIME type text/plain

javascript - 在 Internet Explorer 上淡化图像透明度

javascript - 使用 bgStretcher 时可能发生 jQuery 冲突

javascript - 如何使用javascript根据背景颜色更改文本颜色?

javascript - jQuery 插件回调无法正常工作

jquery - 如何正确实现带有翻转动画的Bootstrap Card?

javascript - 使用延迟加载作为每次滚动的动画效果?

php - CSS/HTML 内联和居中两个单独表单的表单按钮