HTML5 – Verwendung und Kompatibilität neuer semantischer Elemente

1. Neue semantische Elemente:

HTML5 bietet neue semantische Elemente zur Verdeutlichung verschiedener Teile einer Webseite.

• : beschreibt den Kopfbereich des Dokuments , wird zur Definition des verwendet Einführungsanzeigebereich des Inhalts

• : Der Teil , der den Navigationslink definiert.

• : definiert den Abschnitt (Abschnitt, Abschnitt) im Dokument. Der Abschnitt , beispielsweise ein Kapitel, eine Kopfzeile, eine Fußzeile oder ein anderer Teil des Dokuments, enthält normalerweise eine Gruppe von Inhalten und deren Titel.

• : definiert unabhängige Inhalte.

• : Definieren Sie Inhalte außerhalb des Hauptbereichs der Seite (z. B. der Seitenleiste).

• : Das Tag spezifiziert unabhängige Stream-Inhalte (Bilder, Diagramme, Fotos, Code usw.).

• : definiert den Titel des

  
  

• : beschreibt den unteren Bereich des Dokuments , Eine Fußzeile enthält normalerweise den Autor und das Urheberrecht Informationen zum Dokument, verlinkte Nutzungsbedingungen, Kontaktinformationen usw. .

Auf einer Webseite sind die Positionen dieser neuen semantischen Tag-Elemente wie folgt:

2. Browserkompatibilitätsprobleme für neue Elemente:

Damit diese Blöcke und Elemente in allen Browserversionen wirksam werden, müssen Sie dies tun Fügen Sie sie im Stil hinzu. Legen Sie die Attribute in der Tabellendatei fest (der folgende Stilcode ermöglicht es älteren Browsern, die in diesem Kapitel vorgestellten Elemente auf Blockebene zu unterstützen):

header, section, footer, aside, nav, article, figure
{ 
    display: block; 
}

IE8 und frühere IE-Versionen können keine CSS-Effekte in diesen Elementen rendern, daher können Sie

,

,

, < nicht verwenden. aside>,

,

oder andere HTML5-Elemente Sie können HTML5 Shiv verwenden, um dieses Problem zu lösen:

<!--[if lt IE 9]>
<script src="html5shiv.js"></script>
<![endif]-->

Das Obige ist die Verwendung und Kompatibilität von HTML5-neuen semantischen Elementen. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website ( www.php.cn)!