html - 在屏幕底部放置一个 div，而不是页面

Question

无论分辨率如何，我都试图在我的网页屏幕底部放置一个灰色条。但是，当我尝试使用不同的分辨率时，它似乎只是上升或下降。有什么办法可以解决这个问题吗？

此外，该栏是使用 div id 标记由 CSS 制成的。

/* HTML*/
<div id="info">Scroll for info</div>

/* CSS */
<style>
#info { 
    height: 40px; 
    position: relative; 
    margin-top: 25%; 
    background-color: #393838; 
    opacity: 
}
</style>

编辑:我希望它位于屏幕底部，但当我向下滚动时，它会上升到屏幕顶部。

Answer 1

如果你想让它在底部并且一直在底部，你必须使用position: fixed。你可以试试这个:

#info { 
    height: 40px; 
    position: fixed; 
    bottom:0%;
    width:100%; 
    background-color: #393838; 
    opacity: 1;
}

http://jsfiddle.net/rX4nd/1/