gpt4 book ai didi

html - 没有导航栏的 Bootstrap 粘性页脚

转载 作者:太空宇宙 更新时间:2023-11-04 13:54:45 24 4
gpt4 key购买 nike

我无法将此页脚粘贴到页面底部,但当我调整浏览器大小时它拒绝粘贴。

这是代码 http://jsbin.com/piwut/2/

贾斌

<div id="wrap">


<div class="container">
<div class="page-header">
<h1>Sticky footer with fixed navbar</h1>
</div>
<p class="lead">Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS.
</div> <!-- end container -->
<div id="push"></div>
</div> <!-- end wrap -->

<div id="footer">
<div class="container">
<p class="text-muted credit"> Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS.Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS.Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS.Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS.Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS.Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS.Example courtesy <a href="http://martinbean.co.uk">Martin Bean</a> and <a href="http://ryanfait.com/sticky-footer/">Ryan Fait</a>.</p>
</div>
</div>

CSS:

      /* Sticky footer styles
-------------------------------------------------- */

html,
body {
height: 100%;
/* The html and body elements cannot have any padding or margin. */
}

/* Wrapper for page content to push down footer */
#wrap {
min-height: 100%;
height: auto !important;
height: 100%;
/* Negative indent footer by it's height */
margin: 0 auto -100px;
}

/* Set the fixed height of the footer here */
#push,
#footer {
height: 100px;
}
#footer {
background-color: black;
}

/* Lastly, apply responsive CSS fixes as necessary */
@media (max-width: 767px) {
#footer {
margin-left: -20px;
margin-right: -20px;
padding-left: 20px;
padding-right: 20px;
}
}

最佳答案

也许你终于找到了 id,但这是我用的

#footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
}

关于html - 没有导航栏的 Bootstrap 粘性页脚,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21972178/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com