粘性页脚和页脚颜色不变

Question

我在让页脚停留在底部时遇到问题我已将其设置为 position: fixed;但如果内容发生变化，它仍然会出现。另外，我无法更改背景颜色。我的代码有什么问题只是我没有看到吗？

HTML:

<div id="footer">
  <div class="container">
    <span class="left text-muted">content </span>
    <span class="right">
    Content
    </span>  
  </div>
</div>

CSS:

.footer {
height: 60px;
background-color: #939598;
position: fixed;
}

.left {
float:left;
align: left;
}

.right {
float:right;
}

Answer 1

您使用了错误的选择器。

它应该是基于 id 的选择器 #footer 而不是基于 class 的 .footer。

#footer {
  height: 60px;
  width: 100%;
  background: #939598;
  position: fixed;
  bottom: 0px
}
.left {
  float: left;
}
.right {
  float: right;
}

<div id="footer">
  <div class="container">
    <span class="left text-muted">content </span>
    <span class="right">
   footer  Content
    </span> 
  </div>
</div>

粘性页脚和页脚颜色不变

Sticky footer and footer color not changing

html

css

background-color

sticky-footer