文档的页脚：
<footer>
<p>Posted by: Hege Refsnes</p>
<p><time pubdate datetime="2012-03-01"></time></p>
</footer>
IE 9、Firefox、Opera、Chrome 和 Safari 支持 <footer> 标签。
注释：IE 8 或更早版本的 IE 浏览器不支持 <footer> 标签。
标签定义及使用说明
<footer> 标签定义文档或者文档的一部分区域的页脚。
<footer> 元素应该包含它所包含的元素的信息。
在典型情况下，该元素会包含文档创作者的姓名、文档的版权信息、使用条款的链接、联系信息等等。
在一个文档中，您可以定义多个 <footer> 元素。
html footer 始终靠底部
html footer置于页面最底部的方法实例代码如下:
footer的父层的最小高度是100%，footer设置成相对于父层位置绝对（absolute）置底（bottom：0），父层内要预留footer的高度。
<!-- 父层 -->
<div id="wapper">
<!-- 主要内容 -->
<div id="main-content">
</div>
<!-- 页脚 -->
<div id="footer">
</div>
</div>
CSS如下：
#wapper{
position: relative; /*重要！保证footer是相对于wapper位置绝对*/
height: auto; /* 保证页面能撑开浏览器高度时显示正常*/
min-height: 100% /* IE6不支持，IE6要单独配置*/
}
#footer{
position: absolute; bottom: 0; /* 关键 */
left:0; /* IE下一定要记得 */
height: 60px; /* footer的高度一定要是固定值*/
}
#main-content{
padding-bottom: 60px; /*重要！给footer预留的空间*/
}html footer footer实现在底部+居中的方法
1、水平居中可以使用width: 100%和text-align: center;
2、垂直居中并实现动态变化可以使用onresize事件+js动态设置布局（position: absolute; 以及top/bottom）来实现；
3、 图片在div中居中设置：使用margin: 0px auto;
4、怎么保证左右拉伸时图片和输入框的绝对居中效果不变，设置最小宽度min-width的值一致即可. 其他使用了display: inline-block的元素同理；
HTML 4.01 与 HTML5之间的差异
<footer> 标签是 HTML 5 中的新标签。
提示：假如您使用 <footer> 元素来插入联系信息，应该在 <footer> 元素内使用 <address> 标签。
<footer> 标签支持 HTML 的全局属性。
事件属性
<footer> 标签支持 HTML 的事件属性。
-
本站(WWW.)旨在分享和传播互联网科技相关的资讯和技术，将尽最大努力为读者提供更好的信息聚合和浏览方式。
本站(WWW.)站内文章除注明原创外，均为转载,整理或搜集自网络.欢迎任何形式的转载，转载请注明出处.
转载请注明：文章转载自:[169IT-IT技术资讯]
本文标题:HTML <footer> 标签
