0

有没有办法可以在实际 HTML 页面的底部而不是屏幕的底部对齐一个分区,所以如果页面高度大于屏幕的高度,这意味着有滚动,则该分区应该保持固定在底部。

.contact_us{
    display: none;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 500px;
    height: 500px;
    background-color: green;
    z-index: 500;
}

在 css 中进行此设置后,它似乎使用屏幕底部而不是页面本身

4

2 回答 2

1

正如评论中提到的,在使用 css 定位时,您需要有某个地方可以参考,否则它会自动参考 Window。 absolute指具有非静态(默认)定位的第一个父级。最常见的技巧是使用相对定位,这非常方便,因为如果您不设置偏移量(顶部,左侧......),除了更改定位类型之外它没有任何效果,从而成为其子项的所有定位的参考

你可以在这里看到一些效果:

http://jsfiddle.net/techunter/M4kSQ/

速记答案

使一位父母具有非静态位置,例如

#some_parent{
    position:relative;
}
于 2013-08-20T09:22:42.167 回答
0

页脚始终位于页面底部(即使内容很短)

演示: http: //gvee.co.uk/files/html/footer.htm

HTML

<div id="container">
    <div id="header">header</div>
    <div id="body">body</div>
    <div id="footer">footer</div>
</div>

CSS

*
{
    margin: 0;
    padding: 0;
    border: 0;
}

html, body
{
    height: 100%;
}

#container
{
    min-height: 100%;
    position: relative;
}

#header
{
    background: #ff0;
    padding: 10px;
}

#body
{
    padding: 10px;
    padding-bottom: 60px;   /* Height of the footer */
}

#footer
{
    position:absolute;
    bottom: 0;
    width: 100%;
    height: 60px;   /* Height of the footer */
    background: #6cf;
}

条件 IE CSS

<!--[if lte IE 6]>
    <style type="text/css">
        #container
        {
            height: 100%;
        }
    </style>
<![endif]-->
于 2013-08-20T08:44:40.673 回答