Rumah > hujung hadapan web > html tutorial > Tag bahagian HTML

Tag bahagian HTML

WBOY
Lepaskan: 2024-09-04 16:31:33
asal
1137 orang telah melayarinya

Artikel berikut menyediakan garis besar bahagian HTML Tag. HTML tag mentakrifkan bahagian dokumen seperti pengepala, bab, pengaki, dsb. Bahagian tag membahagikan kandungan halaman web kepada bahagian & subbahagian. Ia biasanya digunakan apabila terdapat permintaan untuk dua pengaki, pengepala atau mana-mana bahagian baharu yang lain. Teg bahagian secara amnya mengumpulkan blok generik kandungan berkaitan. Kelebihan utama menggunakan

teg ialah ia merupakan elemen semantik yang menerangkan maksudnya kepada pembangun dan penyemak imbas.

Perkara Penting yang Perlu Diperhatikan untuk Tag bahagian

Kedua-dua teg Mula dan Tamat diperlukan untuk teg Bahagian dalam HTML5, iaitu

……..

  • teg digunakan untuk menduakan kandungan, iaitu, ia mengedarkan bahagian dan subseksyen.
  • Jenis kandungan yang dibenarkan untuk teg bahagian ialah kandungan aliran bermaksud teg, sebagai ibu bapa, tidak boleh mempunyai unsur; kemudian kandungan tidak boleh mempunyai tag sebagai induknya; kandungan bahagian dan kandungan yang boleh dirasai.
  • elemen mestilah bukan keturunan elemen.
  • Setiap hendaklah divisualisasikan dengan memperkenalkan teg tajuk sebagai anak kepada elemen.
  • Jika kita perlu mensindiketkan kandungan elemen secara individu, maka kita boleh menggunakan tag sebaliknya.
  • elemen tidak boleh digunakan sebagai bekas generik; inilah yang
    adalah untuk, terutamanya apabila pemotongan dilakukan hanya untuk tujuan penggayaan. Peraturan biasa ialah teg sepatutnya muncul secara logik pada garis besar dokumen.
  • elemen sebagai elemen semantik, ia memberikan makna tentang kandungan yang disertakan, memfokuskan pada bahagian dokumen kepada kedua-dua ejen manusia dan pengguna. Ia ialah elemen semantik generik, jadi anda harus menggunakannya apabila tiada unsur bekas semantik lain (artikel, diketepikan dan nav) yang sesuai.

Sintaks:

Di bawah ialah sintaks yang disebut:

HTML/XHTML

<body>
<section> ... </section>
<body>
Salin selepas log masuk

CSS

section{
--your css code—
}
Salin selepas log masuk

Atribut bahagian Html Tag

Di bawah adalah beberapa sifat yang disebutkan :

1. Atribut Khusus Tag

Tiada atribut khusus hadir untuk digunakan dengan tag.

2. Atribut Global

Seperti semua teg HTML lain, teg juga menyokong atribut global dalam HTML5.

Berikut ialah atribut global:

  • onabort
  • onautolengkap
  • onautocompleteerror
  • pada kabur
  • batalkan
  • oncanplay
  • oncanplaythrough
  • berubah
  • klik
  • tutup
  • pada menu konteks
  • pertukaran terus
  • ondblclick
  • ondrag
  • ondragend
  • ondragenter
  • ondrakeluar
  • ondragleave
  • ondragover
  • ondragstart
  • ondrop
  • perubahan ketahanan
  • sekali dikosongkan
  • selepas
  • onerror
  • onfokus
  • onput
  • tidak sah
  • onkeydown
  • tekan kekunci
  • onkeyup
  • memuat
  • data dimuatkan
  • metadata dimuatkan
  • mulakan muat
  • onmousedown
  • masuk tetikus
  • onmouseleave
  • onmousemove
  • onmouseout
  • atas tetikus
  • onmouseup
  • onmousewheel
  • jeda
  • bermain
  • bermain
  • sedang berjalan
  • onratechange
  • dimulakan semula
  • saiz semula
  • onscroll
  • dicari
  • berusaha
  • semula pilih
  • pameran
  • onsort
  • dipasang
  • serahkan
  • digantung
  • kemas kini ontime
  • ontogol
  • perubahan volum
  • Menunggu

3. Atribut Acara

Tiada atribut acara hadir untuk digunakan dengan tag.

Sifat Pemformatan Teks CSS dalam Tag

Diberikan di bawah ialah Ciri Pemformatan Teks CSS:

  • Warna teks
  • Penjajaran teks
  • Teks-hiasan
  • Teks-transformasi
  • Ketinggian garis
  • Arahan teks
  • Bayang teks
  • Jarak perkataan

Sifat Fon CSS dalam Tag

Diberikan di bawah ialah Ciri Fon CSS:

  • font-style: normal|italic|oblique|initial|inherit
  • font-variant: normal|small-caps|initial|inherit
  • font-weight: normal|bold|bolder|lighter|number|initial|inherit
  • font-size: medium|xx-small|x-small|small|large|x-large|xx-large|smaller|larger|length|initial|inherit
  • font-family: family-name|generic-family|initial|inherit

CSS Test Shadow Property for
Tag

Given below is the CSS Test Shadow Property:

<style>
address{
text-shadow: 1px 1px #FF0000;
}
</style>
Salin selepas log masuk

Examples of HTML section Tag

Given below are the examples of HTML section Tag:

Example #1

Code:

<!DOCTYPE html>
<html>
<head>
<title>Section tag</title>
</head>
<body>
<section>
<h1>eduCBA: Article 1</h1>
<p>Content of Article 1</p>
</section>
<section>
<h1>eduCBA: Article 2</h1>
<p>Content of Article 2</p>
</section>
<section>
<h1>eduCBA: Article 3</h1>
<p>Content of Article 3</p>
</section>
</body>
</html>
Salin selepas log masuk

Output:

Tag bahagian HTML

Example #2

Nested Section Tag.

The

tag can be nested wherein the font size of the subsection is smaller than the section only if both have the same font properties. The subsection is used for organizing complex data.

Code:

<!DOCTYPE html>
<html>
<head>
<title>Section tag</title>
</head>
<body>
<section>
<h1>eduCBA: Article 1</h1>
<p>Content of Article 1</p>
<section>
<h1>Subsection</h1>
<h1>Subsection</h1>
</section>
</section>
<section>
<h1>eduCBA: Article 2</h1>
<p>Content of Article 2</p>
<section>
<h1>Subsection</h1>
<h1>Subsection</h1>
</section>
</section>
<section>
<h1>eduCBA: Article 3</h1>
<p>Content of Article 3</p>
<section>
<h1>Subsection</h1>
<h1>Subsection</h1>
</section>
</section>
</body>
</html>
Salin selepas log masuk

Output:

Tag bahagian HTML

Example #3

Code:

<!DOCTYPE html>
<html>
<head> . . . </head>
<body>
<header>
<h1>HTML Section tag example</h1>
</header>
<main>
<article> An article on HTML Section tag</article>
</main>
<aside> Body of an article </aside>
<footer>
<section>Copyright &copy;2020- EDUCBA.</section>
<address> A- 406, Boomerang, Chandivali Farm Road,
Yadav Nagar, Chandivali, Powai,
Maharashtra, Mumbai - 400072. </address>
</footer>
</body>
</html>
Salin selepas log masuk

Output:

Tag bahagian HTML

Example #4

Code:

<!DOCTYPE>
<html>
<head>
<style&gt
section{
border:1px solid pink;
padding:15px;
margin:10px;
}
</style>
</head>
<body>
<h2> List of Articles</h2>
<section>
<h3>Article 1 heading</h3>
<p> Body of article </p>
</section>
<section>
<h3>Article 2 heading</h3>
<p> Body of article </p>
</section>
<section>
<h3>Article 3 heading</h3>
<p> Body of article </p>
</section>
</body>
</html>
Salin selepas log masuk

Output:

Tag bahagian HTML

Example #5

While creating a

tag in HTML5, we can use either the class or id attributes wherein each id should be unique, and the class can be used multiple times when necessary.

The section should always have a header element (H1 to H6). If a title cannot be given for the section, we can use the

element, which will probably be more appropriate, and always never use the
tag just for putting styles.

Code:

<!DOCTYPE>
<html>
<head>
<style>
section{
border:1px solid pink;
padding:15px;
margin:10px;
}
</style>
</head>
<body>
<section id="sectiontag" class="sectionclass">
<h2>HTML Section tag</h2>
<p>Random text Random text Random text...</p>
</section>
<section id="articletag">
<h2>HTML Article tag</h2>
<p>Random text Random text Random text...</p>
</section>
<section id="footertag">
<h2>HTML Footer tag</h2>
<p>Random text Random text Random text...</p>
</section>
</body>
</html>
Salin selepas log masuk

Output:

Tag bahagian HTML

Conclusion

The

element is a structural HTML element that groups all the related elements. Each
usually includes one or more heading elements and additional elements presenting related content.
is a new HTML5 element used to define an important document section. It is better to use it within articles, to define navigation, or in the header or footer. If a section of the content deserves its heading, which would be listed in a theoretical or actual table of contents, it should be placed as a
.

Atas ialah kandungan terperinci Tag bahagian HTML. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber: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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan