HTML5 neue Tags Header, Footer, nav, zur Seite, Abschnitt, Artikel, hgroup

HTML5 новые тэги header, footer, nav, aside, section, article, hgroup

Lassen Sie uns über Ihre neue Tags in HTML5 sprechen.

Für einen Start, Blick auf die meisten global: Abschnitt, Artikel, Header, Footer , nav, beiseite und hgroup.

HTML5 viel mehr semantisch korrekten Standard.

Einige der speziellen Website mit dem Namen schließlich ihre standardisierten Namen, so dass in der Zukunft gibt es keine Verwirrung: header - der obere Abschnitt der Website, Footer - Boden, nav - Navigationsgerät usw. In der Tat, beseitigt die Notwendigkeit, einen neutralen DIV-Tag zu verwenden, um diese Teile der Website zu verweisen.

Es ist möglich, beispielsweise ein typischer Eintrag:

 <Div id = "header">
 <H1> <a href="http://www.examplesite.com/"> meisten Website </a> </ h1>
 </ Div>

neu neu geschrieben als:

 <Header>
 <H1> <a href="http://www.examplesite.com/"> meisten Website </a> </ h1>
 </ Header>

Und in der CSS-Stylesheet-Datei nach einer Reihe von Regeln direkt für die Header-Tag zu verschreiben.

Allerdings gibt es einen Haken. Die Tatsache, dass die meisten Browser noch nicht wissen, was diese neuen Tags sind Blockelemente und betrachten sie zu bespannen als die gleichen Tags <a> Links oder Bilder <img>, zum Beispiel. Daher muss in einem CSS-Stylesheet-Datei für solche Tags gezwungen sein, ihre Blockcharakter zu registrieren:

 Header, Footer, nav, Artikel {display: block;}

Wenn die Semantik des Tags Header, Footer mehr oder weniger klar, sollten die anderen Tags näher betrachten.

nav - wird verwendet, um die Navigationsleiste zu erstellen. Diese Elemente auf einer Seite können mehrere sein. Zum Beispiel kann ein Block von Links auf die Hauptseite der Website und der Navigationsleiste auf die Überschriften.

beiseite - es ist das verbindende Tag, am besten geeignet für die Isolierung der Seitenleiste. Es kann ein nav-Einheiten und andere Elemente enthalten, die nicht in der Tat Navigation sind (Werbebanner, der Autor Bild und Informationen über sie, und sotsialok puzomerki Buttons, etc.).

Abschnitt - auch den Tag verbinden. Darüber hinaus kann es in verschiedenen Rollen tätig: entweder die Seite in mehrere Themenbereiche zu unterteilen (zum Beispiel zu isolieren und somit aus dem Kopf- und Fußzeilen zentralen Teil des Inhalts und der Seitenleiste zu isolieren) oder aufgeteilt in einzelne Abschnitte (dh Absätze) direkt zu dem Artikel auf Seite .

Artikel - für das Seitenlayout zu den einzelnen Artikeln verwendet.

Sowohl der Tag-Abschnitt und der Artikel hat einige interessante Features. Zum Beispiel können Sie jetzt sicher den Header H1 der ersten Ebene verwenden, auf einer Seite ein paar Mal, die bisher nicht erlaubt war. Darüber hinaus kann der Tag-Abschnitt ein Elternteil des Artikels, und der Artikel die Artikel selbst in mehrere Abschnitte zu unterteilen. dh Dieses Design ist durchaus möglich:

 <Section>
 <Article>
 <Section> </ section>
 <Section> </ section>
 </ Article>
 <Article>
 <Section> </ section>
 <Section> </ section>
 </ Article>
 </ Section>

hgroup - tag soll Gruppe Seitentitel zu einer logischen Einheit. Zum Beispiel, um es die Schlagzeile auf der Seite H1 und Beschreibung, dekoriert Tag H3. Auf Seite anschließend mehrmals H3-Tags können für andere Zwecke verwendet werden. Um die Beschreibung der Seite, auf der anderen Seite die H3-Tags zu logisch getrennt, wir kombinieren es mit dem Haupt H1-Tag in der Gruppe, die von einem Tag hgroup angegeben:

 <HGroup>
 <H1> Beste Website </ h1>
 <H3> Hier wird eine Beschreibung des Standorts </ h3>
 </ HGroup>