13518219792
這篇文章給大家分享的是有關(guān)HTML5中的footer標(biāo)簽這么用的內(nèi)容。小編覺得挺實(shí)用的，因此分享給大家做個(gè)參考。一起跟隨小編過來看看吧。
我們擁有10余年網(wǎng)頁設(shè)計(jì)和網(wǎng)站建設(shè)經(jīng)驗(yàn)，從網(wǎng)站策劃到網(wǎng)站制作，我們的網(wǎng)頁設(shè)計(jì)師為您提供的解決方案。為企業(yè)提供成都網(wǎng)站制作、成都做網(wǎng)站、微信開發(fā)、小程序開發(fā)、手機(jī)網(wǎng)站制作設(shè)計(jì)、H5建站、等業(yè)務(wù)。無論您有什么樣的網(wǎng)站設(shè)計(jì)或者設(shè)計(jì)方案要求，我們都將富于創(chuàng)造性的提供專業(yè)設(shè)計(jì)服務(wù)并滿足您的需求。
HTML5中footer標(biāo)簽的用法你知道嗎？，HTML5中的footer標(biāo)簽是什么意思？本篇文章就為大家介紹HTML5中footer標(biāo)簽的定義和具體用法，還有footer中的標(biāo)準(zhǔn)屬性，還有置于頁面最底部的簡單實(shí)現(xiàn)方法。
HTML5中footer標(biāo)簽定義和用法：
在典型情況下，該元素會(huì)包含創(chuàng)作者的姓名、文檔的創(chuàng)作日期以及/或者聯(lián)系信息。
在一個(gè)文檔中，可以定義多個(gè)
實(shí)例
文檔的頁腳：
HTML 4.01 與 HTML 5 之間的差異
提示：假如您使用 footer 來插入聯(lián)系信息，應(yīng)該在 footer 元素內(nèi)使用
元素。HTML中footer的標(biāo)準(zhǔn)屬性：
class, contenteditable, contextmenu, dir, draggable, id, irrelevant,
lang, ref, registrationmark, tabindex, template, title
html5語法結(jié)構(gòu) - TOP
1.語法
<footer> 創(chuàng)新互聯(lián)<br /> 學(xué)習(xí)CSS，找DIV+CSS資源上創(chuàng)新互聯(lián)! footer>
2.對footer元素標(biāo)簽加id
<footer id=”abc”> 創(chuàng)新互聯(lián)<br /> 學(xué)習(xí)CSS，找DIV+CSS資源上創(chuàng)新互聯(lián)! footer>
3.對footer標(biāo)簽加class
<footer class=”yanshi”> 創(chuàng)新互聯(lián)<br /> 學(xué)習(xí)CSS，找DIV+CSS資源上創(chuàng)新互聯(lián)! footer>
4、知識擴(kuò)展
我們在html5開發(fā)使用footer標(biāo)簽時(shí)，把當(dāng)作普通div標(biāo)簽對待即可，只不過一般用于網(wǎng)站底部布局。一般情況下一篇網(wǎng)頁只有一個(gè)底部區(qū)，所以使用最好只使用一次footer即可。
注意：是html5新增的，在IE8及以下IE瀏覽器不兼容，謹(jǐn)慎使用。
在網(wǎng)上看到一篇置于頁面最底部的簡單實(shí)現(xiàn)方法，現(xiàn)在分享給大家
需求：有時(shí)候，當(dāng)頁面內(nèi)容較短，撐不開瀏覽器高度，但是又希望footer能在窗口最低端。
思路：footer的父層的最小高度是100%，footer設(shè)置成相對于父層位置絕對（absolute）置底（bottom：0），父層內(nèi)要預(yù)留footer的高度。
html代碼：
XML/HTML Code復(fù)制內(nèi)容到剪貼板
CSS如下：
CSS Code復(fù)制內(nèi)容到剪貼板
#wapper{
position: relative; /*重要！保證footer是相對于wapper位置絕對*/
height: auto; /* 保證頁面能撐開瀏覽器高度時(shí)顯示正常*/
min-height: 100% /* IE6不支持，IE6要單獨(dú)配置*/
}
#footer{
position: absolute; bottombottom: 0; /* 關(guān)鍵 */
left:0; /* IE下一定要記得 */
height: 60px; /* footer的高度一定要是固定值*/
}
#main-content{
padding-bottom: 60px; /*重要！給footer預(yù)留的空間*/
}這時(shí)候，其它瀏覽器上都能正常顯示了，但是IE 6要另外處理：
CSS Code復(fù)制內(nèi)容到剪貼板
感謝各位的閱讀！關(guān)于HTML5中的footer標(biāo)簽這么用就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，讓大家可以學(xué)到更多知識。如果覺得文章不錯(cuò)，可以把它分享出去讓更多的人看到吧！
