如何在引导上使用HTML创建固定页脚

如何在引导上使用HTML创建固定页脚,html,css,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&g

在下面的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 {
  position: absolute;
  bottom: 0; 
}

请参见小提琴:“

将以下样式添加到页脚类:

.footer {
  position: absolute;
  bottom: 0; 
}

请看小提琴:“

您也可以使用:

.footer {
    position:fixed; 
    bottom:0;
}

如果希望页脚固定到视口窗口并始终可见。

您也可以使用:

.footer {
    position:fixed; 
    bottom:0;
}

如果希望页脚固定到视口窗口并始终可见。

假设主体元素是页脚父元素,如果不是,则应用于主体的样式需要应用于父元素

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

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

假设body元素是页脚父元素(如果不是),则应用于body的样式需要应用于父元素

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

footer{
  width:100%;
  position:absolute;  // or fixed, depending on your use
  bottom:0;
  left:0;
}
请参见此示例:

在您的示例中,css只需更改位置即可更正。即 位置:相对于位置:固定

您正在使用引导,请参阅此引导解决方案

他们正在使用位置:绝对

如果使用绝对值,请确保页脚不在任何具有某个位置的div中。所以,若你们应用绝对位置,那个么把你们的页脚放在身体里

请参见此示例:

在您的示例中,css只需更改位置即可更正。即 位置:相对于位置:固定

您正在使用引导,请参阅此引导解决方案

他们正在使用位置:绝对

如果使用绝对值,请确保页脚不在任何具有某个位置的div中。所以,若你们应用绝对位置,那个么把你们的页脚放在身体里


以下链接可能会帮助您添加类页脚。试试这个你是否得到了解决方案你删除了你的评论?下面的链接可能会帮助你添加类页脚。试试这个你有没有办法?你删除了你的评论?@care567使用z-index:9;在页脚类中,我看到您的旋转木马窗口重叠页脚而没有滚动,我想固定在底部?我认为你必须把页脚放在底部,这意味着当你滚动时最后一个包含不想用滚动显示?@care567使用z-index:9;在页脚类中,我看到您的旋转木马窗口重叠页脚而没有滚动,我想固定在底部?我认为你必须把页脚放在底部,这意味着当你滚动时最后一个包含不想用滚动显示?