gpt4 book ai didi

html - 如何让页脚保持在页面底部?

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

这是我的 html 页面。

<!DOCTYPE HTML>
<head>
<style>
#foot {
position:absolute;
bottom:0;
width:100%;
height:60px; /* Height of the footer */
background:#6cf;
}

.container{
border: 1px solid RGB(100,100,100);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 5px;
height: 940px;
width: 1200px;
background: white;
box-shadow: 0px 0px 5px;
position: absolute;
margin-left: 25px;
margin-right: 20px;
margin-top: 80px;
}
</style>
</head>
<body>
<h1>My Page</h1>
<div class="container">
</div>
<footer id="foot">
My footer
</footer>
</body>
</html>

但这会将页脚保留在页面之间。有人可以帮助我吗?

最佳答案

你想用

position:fixed;

为了#foot

http://jsfiddle.net/q3U4R/

可能是更好的方法:

http://jsfiddle.net/q3U4R/1/

* { margin:0; padding:0; } 

html, body, #wrap { height: 100%; }

body > #wrap {height: auto; min-height: 100%;}

. container { padding-bottom: 150px; } /* must be same height as the footer */

#foot {
position: fixed;
margin-top: -150px; /* negative value of footer height */
height: 150px;
clear:both;
background:#ff0;
bottom:0px;
width:100%;
}

关于html - 如何让页脚保持在页面底部?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15425372/

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