Heim >Web-Frontend >H5-Tutorial >Was ist das Abschnitts-Tag in HTML5? Wie zentriere ich das Abschnitts-Tag in HTML5?
Was ist das Abschnitts-Tag in HTML5? Wie zentriere ich das Abschnitts-Tag in HTML5?
- 寻∝梦Original
- 2018-08-15 13:29:1612144Durchsuche
Was ist das Abschnitts-Tag in HTML5? Wie zentriere ich das Abschnitts-Tag in HTML5? In diesem Artikel finden Sie ausführliche Beispiele für die Definition und Funktion von Abschnitten in HTML5. (Es gibt später auch ein -Element, das etwas zu sagen hat )
HTML5 – neue semantische Elemente Kopfzeile, Navigation, Abschnitt, Artikel, Seite, Fußzeile usw.
in HTML5 im Vergleich zu früheren Versionen In Bezug auf das Schreiben von Dokumenten wurden einige Tags hinzugefügt. Elementstruktur wie Kopfzeile, Fußzeile, Inhaltsbereich usw. Darunter werden Artikel- und Abschnittselemente zu den Hauptstrukturelementen hinzugefügt. Was ist also der Unterschied zwischen ihnen? Wann wird ein Artikel verwendet und welcher Abschnitt wird verwendet?
Was ist ein Artikel?Was ist das Artikel-Tag in HTML5? Wo wird das Artikelelement in HTML5 verwendet?
Lassen Sie uns heute über die Definition des 2f8332c8dcfd5c7dec030a070bf652c3-Elements im neuen semantischen Element sprechen:
2f8332c8dcfd5c7dec030a070bf652c3: Es definiert das Dokument Abschnitt (Abschnitt, Abschnitt). Beispielsweise ein Kapitel, eine Kopfzeile, eine Fußzeile oder ein anderer Teil des Dokuments. Ein Abschnitt enthält normalerweise eine Reihe von Inhalten und seinen Titel.
Die Rolle des Abschnittselements in HTML5:
Das Abschnittselement wird verwendet, um den Inhalt auf der Seite zu segmentieren, z. B. Artikelsegmentierung usw., angrenzende Abschnitte Elemente Der Inhalt sollte relevant und nicht unabhängig wie ein Artikel sein. Zum Beispiel ein Artikel:
<article>
<header><h1>计算机各类语言介绍</h1></header>
<p>本文列举了部分计算机语言的一些介绍</p>
<section>
<h2>JavaScript</h2>
<p>js是一门……</p>
</section>
<section>
<h2>HTML</h2>
<p>HTML是一门……</p>
</section>
<footer>版权归微也所有</footer>
</article>So zentrieren Sie das Abschnitts-Tag in HTML5:
Ich denke, verwenden Sie den CSS-Stil, text-align: center, this to center, Schauen Sie sich ein Beispiel an:
<!DOCTYPE HTML>
<html>
<meta charset="UTF-8" />
<head>
<title>PHP中文网</title>
</head>
<script src="http://lwww.php.cn/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript">
</script>
<style type="text/css">
html,
body {
margin: 0;
padding: 0;
}
.demo {}
</style>
<body>
<div class="demo">
<section style="text-align: center;">
<h1>title</h1>
<p>2017-07-11</p>
</section>
</div>
</body>
</html>Obwohl das Abschnittselement technisch stilierbar ist, empfehlen wir dennoch die Verwendung des div-Elements, wenn es komplexe Stile oder Skripte gibt.
Ähnlich wie das 25edfb22a4f469ecb59f1190150159c6-Element wird das Abschnittselement zum Auflisten von Inhalten verwendet.
In einem realen Beispiel besteht der Grund für die Verwendung des 2f8332c8dcfd5c7dec030a070bf652c3-Elements darin, den Inhalt des Blogs zu strukturieren. Der Code lautet wie folgt:
<div class="blog">
<section class="post">
<h2 class="post-title">Blog Post Title</h2>
<p class="post-excerpt">Ice cream tart powder jelly-o.
Gummies chocolate cake ice cream cookie halvah tiramisu jelly-o.</p>
</section>
<section class="post">
<h2 class="post-title">Blog Post Title</h2>
<p class="post-excerpt">Ice cream tart powder jelly-o.
Gummies chocolate cake ice cream cookie halvah tiramisu jelly-o.</p>
</section>
<section class="post">
<h2 class="post-title">Blog Post Title</h2>
<p class="post-excerpt">Ice cream tart powder jelly-o.
Gummies chocolate cake ice cream cookie halvah tiramisu jelly-o.</p>
</section>
</div>Dies ist nur ein Beispiel. Das Element 2f8332c8dcfd5c7dec030a070bf652c3 kann auch für andere Zwecke verwendet werden.
【Elemente haben etwas zu sagen】
Abschnitt:
Hallo, meine Damen und Herren, ich bin Abschnitt. Die internationale Konferenz, an der ich teilnahm, stellte mich folgendermaßen vor: „Das Abschnittselement stellt einen allgemeinen Abschnitt eines Dokuments oder einer Anwendung dar. Ein Abschnitt ist in diesem Zusammenhang eine thematische Gruppierung von Inhalten, typischerweise mit einer Überschrift, die ich mit Semantic div verbinde.“ „Beispiele für Abschnitte wären Kapitel, die verschiedenen Registerseiten in einem Registerdialogfeld oder die nummerierten Abschnitte einer These. Die Homepage einer Website könnte in Abschnitte für eine Einführung, Nachrichten und Kontaktinformationen unterteilt werden.“ Ich besuche normalerweise Kapitel mit Artikeln, Tabs in einem Tab-Dialogfeld oder nummerierte Abschnitte einer Arbeit. Die Homepage einer Website kann in Abschnitte wie Einführung, Neuigkeiten und Kontaktinformationen unterteilt werden. Ich bin kein gewöhnlicher Container-Tag. Wenn ein Tag nur zum Stylen oder zur Erleichterung der Skripterstellung dient, sollten Sie zu meinem Freund div gehen. Im Allgemeinen bin ich gut mit Elementen, deren Inhalt klar in der Dokumentgliederung erscheint. Normalerweise mit einer Überschrift, 2f8332c8dcfd5c7dec030a070bf652c34a249f0d628e2318394fd9b75b4636b1473f0a7621bec819994bb5020d29372ae388a4556c0f65e1904146cc1a846bee94b3e26ee717c64999d7867364b1b4a34d7ab0de9a42de71c682b0860bad1410. Ich würde es verwenden, um Inhalte auf Seiten einer Website oder Anwendung aufzuteilen.
[Verwandte Empfehlungen]
Welche Attribute hat das HTML-IMG-Tag? Verstehen Sie die Verwendung des IMG-Tags
Was ist Web in HTML5? Was sind die Elemente im Webspeicher?
Das obige ist der detaillierte Inhalt vonWas ist das Abschnitts-Tag in HTML5? Wie zentriere ich das Abschnitts-Tag in HTML5?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
In Verbindung stehende Artikel
Mehr sehen- Das Vollbild-Bildlauf-Plug-in AlloyTouch erstellt in 30 Sekunden eine flüssige H5-Seite
- Tatsächlicher HTML5-Kampf und Analyse von Touch-Ereignissen (Touchstart, Touchmove und Touchend)
- Ausführliche Erläuterung der Beispiele für Bildzeichnungen in HTML5 Canvas 9
- Reguläre Ausdrücke und neue HTML5-Elemente
- So kombinieren Sie NodeJS und HTML5, um mehrere Dateien per Drag-and-Drop auf den Server hochzuladen