Rumah hujung hadapan web html tutorial html header标签和footer标签区别的两点总结(附元素区别实例)

html header标签和footer标签区别的两点总结(附元素区别实例)

Aug 30, 2018 pm 05:17 PM
header html

本篇文章主要的为大家讲述的关于HTML header标签和footer标签的两点区别,接下来就让我们一起来看这篇关于HTML header标签和footer标签的文章吧

一、我们先来看看

标签和
标签的区别:

标签定义文档或者文档的一部分区域的页眉。

元素应该作为介绍内容或者导航链接栏的容器。在一个文档中,可以定义多个
元素。

注释:

标签不能被放在
或者另一个
元素内部。

标签定义文档或者文档的一部分区域的页脚。

元素应该包含它所包含的元素的信息。

在典型情况下,该元素会包含文档创作者的姓名、文档的版权信息、使用条款的链接、联系信息等等。

在一个文档中,您可以定义多个

元素。

<article>
  <header>
    <h1>这是PHP中文网介绍的页头</h1>
    <p><time pubdate datetime="2011-03-15"></time></p>
  </header>
  <p>Windows Internet Explorer 9 (abbreviated as IE9) 这里是PHP中文网</p>
</article>
<footer>
  <p>这里是PHP中文网中的页脚footer的用法</p>
  <p><time pubdate datetime="2012-03-01"></time></p>
</footer>
Salin selepas log masuk

这里有效果图:

tuyi.png

二、我们现在来看看header标签和footer标签的另一方面的区别:

header元素:

表示其最近父元素的一组引导性内容。header的父元素可能是分节元素(artic,section,aside等)或根元素(body元素)。当header元素的最近父元素是body元素,那么header元素表示的是整个HTML页面的一组引导性内容。如果在HTML文档中有一个新的区域内容,那么就可以根据内容的需要来添加header元素,这样做会提高文档的语义。

footer元素:

表示其最近父元素补充说明的内容,footer的父元素可能是分节元素或根元素。

footer元素内容通常与当前所在区域内容有关系,比如:当前所在区域内容的相关链接、版权信息等。

当footer元素的最近父元素是body元素,那么footer元素表示的是整个HTML页面的补充说明。

footer元素通常用来标记页面内容的一些扩展信息,比如:附录、条款、版本信息、许可协议、或其他内容。

这还有个关于header标签和footer标签区别的实例:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>PHP中文网演示</title>
</head>
<body>
<article>
<header>
<h3>文章的标题</h3>
<h5>作者</h5>
</header>
<p>我是正文-我是正文-我是正文-------------<></p>
<article>
<head>
<h4>网友的评论</h4>
<p>评论内容-评论内容-评论内容----------</p>
</head>
<footer>
发布时间:1433223
</footer>
</article>
<footer>
<p>尾部:3000:评论</p>
</footer>
</article>
</body>
</html>
Salin selepas log masuk

效果是这样的:

tuer.png

以上就是这篇文章的全部内容了(想看更多,欢迎来到PHP中文网学习。更多的编程课程等着你的到来),有问题的可以在下方留言

【小编推荐】

html5 header标签是什么意思?html5 header标签的用法详解(附实例)

input表单如何制作多行文本输入框?一篇文章教你学会使用input标签

Atas ialah kandungan terperinci html header标签和footer标签区别的两点总结(附元素区别实例). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Artikel Panas

<🎜>: Bubble Gum Simulator Infinity - Cara Mendapatkan dan Menggunakan Kekunci Diraja
4 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
Nordhold: Sistem Fusion, dijelaskan
4 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
Mandragora: Whispers of the Witch Tree - Cara Membuka Kunci Cangkuk Bergelut
4 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
<🎜> obscur: Ekspedisi 33 - Cara mendapatkan pemangkin Chroma yang sempurna
2 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

Tutorial Java
1677
14
Tutorial PHP
1278
29
Tutorial C#
1257
24
Sempadan Jadual dalam HTML Sempadan Jadual dalam HTML Sep 04, 2024 pm 04:49 PM

Panduan untuk Sempadan Jadual dalam HTML. Di sini kita membincangkan pelbagai cara untuk menentukan sempadan jadual dengan contoh Sempadan Jadual dalam HTML.

Jadual Bersarang dalam HTML Jadual Bersarang dalam HTML Sep 04, 2024 pm 04:49 PM

Ini ialah panduan untuk Nested Table dalam HTML. Di sini kita membincangkan cara membuat jadual dalam jadual bersama-sama dengan contoh masing-masing.

HTML jidar-kiri HTML jidar-kiri Sep 04, 2024 pm 04:48 PM

Panduan untuk HTML margin-kiri. Di sini kita membincangkan gambaran keseluruhan ringkas tentang HTML margin-left dan Contoh-contohnya bersama-sama dengan Pelaksanaan Kodnya.

Susun Atur Jadual HTML Susun Atur Jadual HTML Sep 04, 2024 pm 04:54 PM

Panduan untuk Susun Atur Jadual HTML. Di sini kita membincangkan Nilai Susun Atur Jadual HTML bersama-sama dengan contoh dan output n perincian.

Pemegang Tempat Input HTML Pemegang Tempat Input HTML Sep 04, 2024 pm 04:54 PM

Panduan untuk Pemegang Tempat Input HTML. Di sini kita membincangkan Contoh Pemegang Tempat Input HTML bersama-sama dengan kod dan output.

Bagaimana anda menghuraikan dan memproses HTML/XML dalam PHP? Bagaimana anda menghuraikan dan memproses HTML/XML dalam PHP? Feb 07, 2025 am 11:57 AM

Tutorial ini menunjukkan cara memproses dokumen XML dengan cekap menggunakan PHP. XML (bahasa markup extensible) adalah bahasa markup berasaskan teks yang serba boleh yang direka untuk pembacaan manusia dan parsing mesin. Ia biasanya digunakan untuk penyimpanan data

Senarai Tertib HTML Senarai Tertib HTML Sep 04, 2024 pm 04:43 PM

Panduan kepada Senarai Tertib HTML. Di sini kami juga membincangkan pengenalan senarai dan jenis Tertib HTML bersama-sama dengan contoh mereka masing-masing

Butang onclick HTML Butang onclick HTML Sep 04, 2024 pm 04:49 PM

Panduan untuk Butang onclick HTML. Di sini kita membincangkan pengenalan, kerja, contoh dan onclick Event masing-masing dalam pelbagai acara.

See all articles