我已经尝试了一切我能想到的将联系信息集中在页脚上方,但我能得到的最接近的是这个。此代码使表格从页面的50%开始,但我希望表格的中心位于页面的50%。我可以这样做,但我发现在放大和缩小时保持相同的缩放比例(例如底部的版权条)是不可能这样做的。谢谢你的耐心等待。
这是我的相关CSS代码
#push{height:80px}
#footer{
padding:0px 0px 0px 0px;
border-top:0px solid #dadada; width:100%;
margin:0px 0px 0px 0px;
color:#583625;}
#footer p{
position:absolute;
font-size:1em; color:#4d4d4d;
line-height:1.5em; margin-bottom:0;
margin-top:0.6em;
background-color:#6A412D;
width:100%;
}
.copyrightbar {
margin: 0px 0px 0px 0px;
border-collapse: collapse;
border: 0px;
padding: 0px 0px 0px 0px;
}
.copyrightbar2 {
margin: -100px 0px 0px 50%;
border: 0px;
padding: 0px 0px 0px 0px;
position:absolute;
}
这是我的HTML代码
<div class="copyrightbar2">
<table>
<tr>
<td>
<p>
<font color="white">Phone: <a href="tel:1800888888" style="text-decoration:none">18008888888</a><br>Fax:1-800-888-88888<br>
USA:<a href="tel:8002556214" style="text-decoration:none">1-800-255-6214</a><br>
Canada:<a href="tel:8002556214" style="text-decoration:none">1-800-255-6214</a>  </br>
</font>
</p>
</td>
<td>
<p>
<font color="white">
Company<br>Sydney Australia<br>
</font>
<a href="https://imgur.com" style="text-decoration:none"> <font color="white"> Emailaddress@email.com</a>
</p>
</td></tr>
</table>
</div>
<div class="copyrightbar" id="footer">
<p align="center">
<font color="white" font size="2">
<i>All Rights Reserved. </i>
</font>
</p>
<div class="push"></div>
答案 0 :(得分:1)
我用你的代码创造了一个小提琴。注意你的HTML结构。你没有关闭每个标签。
始终关闭您打开的每个HTML代码!
要移动页面底部的div,请将position:absolute;
和bottom:0;
添加到您的css文件中。更多信息 here 。
要将div居中,您可以使用margin:auto;
。这些链接可能会对您有所帮助:
http://www.w3schools.com/css/css_align.asp
http://www.w3schools.com/css/css_margin.asp
我更新了你的代码并将其粘贴到一个小提琴中。如果您有任何其他问题,请随时询问:)
<强> jsFiddle Demo 强>