0

这是html:

<div id="terms" class="terms">
        <center><a href="terms.html">Terms & Conditions</a>
</div>

CSS:

# terms {
width: 100%;
position: absolute;
bottom: 0;

}

.terms {
width: 100%;
position: relative;
bottom: 5px;
}

我究竟做错了什么?我已经尝试了大约 50 种不同的 html 和 css 变体,以使这些术语留在页面底部,但它在页面中心浮动。它会从顶部到中间到左右,但我不能让它浮动到页面底部!整个页面设置为两个浮动列.right,并且.left

请帮忙!!谢谢你!

4

3 回答 3

2

我为你准备了一个小提琴:

http://jsfiddle.net/uh53X/1/

修改您的代码如下:

HTML

<div class="terms">
  <center><a href="terms.html">Terms & Conditions</a></center>
</div>

CSS

div.terms{
    display:block;
    position:absolute;
    bottom:0;
    right:0;
    width:100%;
    background:#eee;
    border:1px solid #ddd;
}

希望这可以帮助。

于 2012-05-21T04:58:14.730 回答
2

请参考下面的演示

单击此处进行演示

HTML

<div class="wrapper">
    <div id="terms">
        <center><a href="terms.html">Terms &amp; Conditions</a></center>
    </div>
</div>

CSS

.wrapper{
    width:500px;
    height:500px;
}

#terms {
    position: fixed;
    bottom:5px;
    width: 100%;
    left:0px;
    height:25px;
}

根据评论更新:

点击演示 2

HTML

<div class="wrapper">
    <div class="pageBox">
        <p>
        This is test page height will be managed accordingly and footer will be attached after this box.
        </p>
        <p>
        This is test page height will be managed accordingly and footer will be attached after this box.
        </p>
        <p>
        This is test page height will be managed accordingly and footer will be attached after this box.
        </p>
        <p>
        This is test page height will be managed accordingly and footer will be attached after this box.
        </p>
        <p>
        This is test page height will be managed accordingly and footer will be attached after this box.
        </p>
    </div>

    <div id="terms">
        <center><a href="terms.html">Terms &amp; Conditions</a></center>
    </div>
</div>

CSS

.wrapper{
    width:500px;
}

.pageBox{
    height:auto;
}

#terms {
    width: 100%;
    height:25px;
}
于 2012-05-21T05:03:55.560 回答
1

无论您有多少内容,您都想将页脚粘贴到页面底部吗?-粘性页脚,这是我想将页脚锚定到底部时使用的(尽管从您的示例页面的外观来看,它可能不是您所追求的)

或者您只是想确保它位于页面中最后一项的下方?为什么不在最后一项下方和条款之前添加一个清除 div/br

.clearboth {
    font-size: 1px;
    line-height: 0px;
    clear: both;
    height: 0px;
}

<br class="clearboth" />

然后不管两边的浮动,你都可以让你的 div 作为常规项目坐在它下面

希望这些都有帮助

于 2012-05-21T08:47:24.017 回答