HTML5 -Webdesign: Hgroup -Element Verwendung

Artikeleinführung von Wulin.com (www.vevb.com): Übersicht über die Verwendung von HTML5 HGroup -Elementen.

HGroup ist ein neu definiertes Element in HTML5, das zum Gruppieren von Titeln und Untertiteln verwendet wird. Warum brauchen wir ein <hGroup> -Tag, wenn wir bereits das Header -Tag haben? Hier sind die Antworten auf diese Frage

Hier finden Sie eine Beschreibung der Beschreibung des Dokuments von <hgroup>:

HGroups werden im Allgemeinen als Gruppen von Elementen eines oder mehreren H1 bis H6 verwendet, z. B. Titel innerhalb eines Blocks und seiner Untertitel.

Das HGroup-Element wird normalerweise verwendet, um einen Satz von einem oder mehreren H1-H6-Elementen zu gruppieren-um beispielsweise einen Abschnittstitel und einen dazugehörigen Untertitel zu gruppieren.

W3C -Spezifikation

<hGroup> spielt eine Rolle, die einen oder mehrere Titelbezogene Container enthalten kann, die sich im & ls; Header> Element befinden können. Es kann nur Titelelemente aus H1-H6 enthalten, die Untertitel, entweder Auswahltitel oder Tag-Titel sein können.

Ein einfacherer Weg, um zu verstehen, wie man <hgroup> verwendet, ist einige Beispiele. Zum Beispiel das folgende Dr.oli -Beispiel:

Wenn das Artikel -Tag hat und nur einen Titel hat:

1

2

3

4

<artikels>

<h1> Artikeltitel </h1>

<p> Inhalt… </p>

</article>

Wenn das Artikel -Tag einen Titel hat und auch Metadaten (Meatadata) enthält

1

2

3

4

5

6

7

8

<!-Titel und Metadaten in Header->

<artikels>

<Header>

<h1> Artikeltitel </h1>

<p> (<Time DateTime = 2009-07-13> 13. Juli 2009 </time>) </p>

</header>

<p> Inhalt… </p>

</article>

Wenn das Artikel-Tag eine Reihe von selbstklammerenden Titeln hat:

1

2

3

4

5

6

7

8

<!-Titel H1 und Untertitel H2 in Hgroup->

<artikels>

<hgroup>

<h1> Artikeltitel </h1>

<h2> Artikeluntertitel </H2>

</hgroup>

<p> Inhalt… </p>

</article>

Ein Artikel -Tag enthält einen Titel und Untertitel und Metadaten

1

2

3

4

5

6

7

8

9

10

11

<!-eine Überschrift, die Header und Hgroup verwendet->

<artikels>

<Header>

<hgroup>

<h1> Artikeltitel </h1>

<h2> Artikeluntertitel </H2>

</hgroup>

<p> (<Time DateTime = 2009-07-13> 13. Juli 2009 </time>) </p>

</header>

<p> Inhalt… </p>

</article>

Wir verwenden <hGroup>, um die Dokumentenrinde (Dokumentenriss) zu starten.

Wenn sich der Titel der Gruppe im Element <HGroup> befindet, überschreibt der Umrissalgorithmus den Titel mit niedriger Ebene in der Gruppe und verwendet den höchsten Titel als Umriss. Das Folgende ist ein Beispiel:

1

2

3

4

5

6

<Header>

<hgroup>

<H1> <a href =/> mini -Apps </a> </h1>

<h2> Webanwendungen für iPhone, Android und andere mobile Plattformen </H2>

</hgroup>

</header>

<hgroup> enthält die Titelelemente von H1-H2, aber nur <h1> ist in der Umrisse enthalten. Wie in der Abbildung unten gezeigt.

Wir können den Dokumentriss aus diesem Link anzeigen:

Zusammenfassen:

Was wir gerade gesprochen haben, ist, wie man <hgroup> Elemente effizient verwendet. Lassen Sie uns überprüfen:

Wenn Sie nur ein Titelelement haben (eines in H1-H6), brauchen Sie keine <hgroup>.

Wenn ein oder mehrere Titel und Elemente erscheinen, wird <hgroup> angewendet, um sie zu umgeben.

Wenn Ihr Titel einen Untertitel oder eine andere Metadaten auf Abschnitt oder Artikel bezieht, legen Sie die <hgroup> und Metadaten in einen separaten <kopf> Element -Container.

Originalchinesischer: Überblick über die Verwendung von HTML5 HGroup -Elementen

Original Englisch: Vermeiden Sie gemeinsame HTML5 -Fehler