HTML5中footer標籤的用法你知道嗎？ ，HTML5中的footer標籤是什麼意思？
- 寻∝梦原創
- 2018-08-15 15:30:5721594瀏覽
HTML5中footer標籤的用法你知道嗎？ ，HTML5中的footer標籤是什麼意思？本篇文章就為大家介紹HTML5中footer標籤的定義與具體用法，還有footer中的標準屬性，還有置於頁面最底部的簡單實作方法。
HTML5中footer標籤定義與用法：
c37f8231a37e88427e62669260f0074d 標籤定義 section 或 document 的頁尾。
在典型情況下，此元素會包含創作者的姓名、文件的創作日期以及/或聯絡資訊。
在一個文件中，可以定義多個 c37f8231a37e88427e62669260f0074d 元素。
實例
文件的頁尾：
<footer>This document was written in 2010</footer><!DOCTYPE HTML> <html> <body> <footer>This document was written in 2010.</footer> </body> </html>
HTML 4.01 與HTML 5 之間的差異
##c37f8231a37e88427e62669260f0074d標籤是HTML 5 中的新標籤。 提示：假如您使用 footer 來插入聯絡訊息，應該在 footer 元素內使用 208700f394e4cf40a7aa505373e0130b 元素。HTML中footer的標準屬性：
class, contenteditable, contextmenu, dir, draggable, id, irrelevant, lang, ref, registrationmark , tabindex, template, titlehtml5語法結構 - TOP1.語法<</span>footer> PHP中文网<</span>br /> 学习CSS，找DIV+CSS资源上PHP中文网! </</span>footer>2.對footer元素標籤加上id
<</span>footer id=”abc”> PHP中文网<</span>br /> 学习CSS，找DIV+CSS资源上PHP中文网! </</span>footer>3.對footer標籤加class
<</span>footer class=”yanshi”> PHP中文网<</span>br /> 学习CSS，找DIV+CSS资源上PHP中文网! </</span>footer>4、知識擴充我們在html5開發使用footer標籤時，把當作普通div標籤對待即可，只不過一般用於網站底部佈局。一般情況下一篇網頁只有一個底部區，所以使用最好只使用一次footer即可。 注意：是html5新增的，在IE8及以下IE瀏覽器不相容，謹慎使用。 在網路上看到一篇置於頁面最底部的簡單實作方法，現在分享給大家需求：有時候，當頁面內容較短，撐不開瀏覽器高度，但又希望footer能在視窗最低端。 思路：footer的父層的最小高度是100%，footer設定成相對於父層位置絕對（absolute）置底（bottom：0），父層內要預留footer的高度。 html程式碼：XML/HTML Code複製內容到剪貼簿
<!-- 父层 -->
<div id="wapper">
<!-- 主要内容 -->
<div id="main-content">
</div>
<!-- 页脚 -->
<div id="footer">
</div>
</div>CSS如下：CSS Code複製內容到剪貼簿
#wapper{
position: relative; /*重要！保证footer是相对于wapper位置绝对*/
height: auto; /* 保证页面能撑开浏览器高度时显示正常*/
min-height: 100% /* IE6不支持，IE6要单独配置*/
}
#footer{
position: absolute; bottombottom: 0; /* 关键 */
left:0; /* IE下一定要记得 */
height: 60px; /* footer的高度一定要是固定值*/
}
#main-content{
padding-bottom: 60px; /*重要！给footer预留的空间*/
}這時候，其它瀏覽器上都能正常顯示了，但是IE 6要另外處理：CSS Code複製內容到剪貼簿<!--[if IE 6]->
<style>
#wapper{height:100%;} /* IE在高度不够时会自动撑开层*/
</style>
<![endif]-->好了，本篇文章就跟大家說這麼多。關於頁頭的文章也會發布，希望大家點進去看看。 以上是HTML5中footer標籤的用法你知道嗎？ ，HTML5中的footer標籤是什麼意思？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
陳述：
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn