html - 如何在 bootstrap 上使用 HTML 创建固定页脚

标签 html css

在下面的 html 中,页脚没有固定在页面底部。

我该如何解决这个问题?

我设计了一个示例网站,中间有一个日志和一个菜单。现在我需要向页面添加文本,但页脚需要固定在底部。但目前页脚呈现在文本旁边。 谁能帮帮我

html

<div  style="margin-top: 578px; font-size: 31px; max-width:100%;margin:0 auto; float:left; color: orange;">UNDER CONSTRUCTION</div>
<footer>
<div class="footer">
    <div class="container">
        <p>Address:- D-000, Text Text, Text. Text, Text (Text), Text-000 0000, Text <br>
Mobile : +91 000-000-0000 Phone : + 0000 0000 0000 Fax : + 0000 0000 0000 <br>
Email: abc@gmail.com<br>
Copyright &copy; 2015 OLISVELL, Inc.</p>

    </div>
</div>
</footer>

风格

.footer {
color:#EEEEE; 
font: italic 12px/30px Arial;
position: relative;
 width: 100%; 
  float: left;
 bottom: 0; 
  padding-bottom: 2px;
  min-height: 43px;

background:#000000;
}

.footer p{

color:#ffffff;

font-weight:600;
float:left;
text-align:left;

}

最佳答案

假设 body 元素是 footer 父元素,如果不是,则应用于 body 的样式需要应用于父元素。

body{
  height:100%;
  position:relative;
}

footer{
  width:100%;
  position:absolute;  // or fixed, depending on your use
  bottom:0;
  left:0;
}

关于html - 如何在 bootstrap 上使用 HTML 创建固定页脚,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31422019/

相关文章:

html - 我怎样才能让这个汉堡包图片下方的文字从页面左侧开始流动?

javascript - 使用 JavaScript 在解析中保存图像

html - 将 Excel 中的文本添加到 HTML 文件

html - 表格内的 Capture Ace 编辑器

html - 尝试使用 li 将列表放置在 css 的左侧

HTML 到 PDF Rocket - PDF 生成

html - webkit滚动条自定义垂直高度

jquery animate() 不使用 css 属性

javascript - Php 在设定日期后显示信息

html - 如何在内联 CSS 中写入 'a:hover'?