溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

html中header標(biāo)簽和footer標(biāo)簽的區(qū)別有哪些

發(fā)布時(shí)間：2020-09-15 10:22:19 來源：億速云 閱讀：317 作者：小新 欄目：web開發(fā)

這篇文章主要介紹了html中header標(biāo)簽和footer標(biāo)簽的區(qū)別有哪些，具有一定借鑒價(jià)值，需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。

一、我們先來看看<header>標(biāo)簽和<footer>標(biāo)簽的區(qū)別:

<header>標(biāo)簽定義文檔或者文檔的一部分區(qū)域的頁眉。

<header> 元素應(yīng)該作為介紹內(nèi)容或者導(dǎo)航鏈接欄的容器。在一個(gè)文檔中，可以定義多個(gè) <header> 元素。

注釋：<header> 標(biāo)簽不能被放在 <footer>、<address> 或者另一個(gè) <header> 元素內(nèi)部。

<footer> 標(biāo)簽定義文檔或者文檔的一部分區(qū)域的頁腳。

<footer> 元素應(yīng)該包含它所包含的元素的信息。

在典型情況下，該元素會(huì)包含文檔創(chuàng)作者的姓名、文檔的版權(quán)信息、使用條款的鏈接、聯(lián)系信息等等。

在一個(gè)文檔中，您可以定義多個(gè) <footer> 元素。

<article>
  <header>
    <h2>這是億速云介紹的頁頭</h2>
    <p><time pubdate datetime="2011-03-15"></time></p>
  </header>
  <p>Windows Internet Explorer 9 (abbreviated as IE9) 這里是億速云</p>
</article>
<footer>
  <p>這里是億速云中的頁腳footer的用法</p>
  <p><time pubdate datetime="2012-03-01"></time></p>
</footer>

二、我們現(xiàn)在來看看header標(biāo)簽和footer標(biāo)簽的另一方面的區(qū)別:

header元素：

表示其最近父元素的一組引導(dǎo)性內(nèi)容。header的父元素可能是分節(jié)元素（artic，section，aside等）或根元素（body元素）。當(dāng)header元素的最近父元素是body元素，那么header元素表示的是整個(gè)HTML頁面的一組引導(dǎo)性內(nèi)容。如果在HTML文檔中有一個(gè)新的區(qū)域內(nèi)容，那么就可以根據(jù)內(nèi)容的需要來添加header元素，這樣做會(huì)提高文檔的語義。

footer元素：

表示其最近父元素補(bǔ)充說明的內(nèi)容，footer的父元素可能是分節(jié)元素或根元素。

footer元素內(nèi)容通常與當(dāng)前所在區(qū)域內(nèi)容有關(guān)系，比如：當(dāng)前所在區(qū)域內(nèi)容的相關(guān)鏈接、版權(quán)信息等。

當(dāng)footer元素的最近父元素是body元素，那么footer元素表示的是整個(gè)HTML頁面的補(bǔ)充說明。

footer元素通常用來標(biāo)記頁面內(nèi)容的一些擴(kuò)展信息，比如：附錄、條款、版本信息、許可協(xié)議、或其他內(nèi)容。

這還有個(gè)關(guān)于header標(biāo)簽和footer標(biāo)簽區(qū)別的實(shí)例：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>億速云演示</title>
</head>
<body>
<article>
<header>
<h4>文章的標(biāo)題</h4>
<h6>作者</h6>
</header>
<p>我是正文-我是正文-我是正文-------------<></p>
<article>
<head>
<h5>網(wǎng)友的評(píng)論</h5>
<p>評(píng)論內(nèi)容-評(píng)論內(nèi)容-評(píng)論內(nèi)容----------</p>
</head>
<footer>
發(fā)布時(shí)間：1433223
</footer>
</article>
<footer>
<p>尾部：3000：評(píng)論</p>
</footer>
</article>
</body>
</html>

效果是這樣的：

html中header標(biāo)簽和footer標(biāo)簽的區(qū)別有哪些

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享html中header標(biāo)簽和footer標(biāo)簽的區(qū)別有哪些內(nèi)容對(duì)大家有幫助，同時(shí)也希望大家多多支持億速云，關(guān)注億速云行業(yè)資訊頻道，遇到問題就找億速云，詳細(xì)的解決方法等著你來學(xué)習(xí)!

向AI問一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場，如果涉及侵權(quán)請(qǐng)聯(lián)系站長郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手