Heim > Web-Frontend > HTML-Tutorial > Verwenden Sie semantische Tags, um Ihr HTML zu schreiben, das mit IE6,7,8_HTML/Xhtml_Webpage Production kompatibel ist

Verwenden Sie semantische Tags, um Ihr HTML zu schreiben, das mit IE6,7,8_HTML/Xhtml_Webpage Production kompatibel ist

WBOY
Freigeben: 2016-05-16 16:36:13
Original
1628 Leute haben es durchsucht

HTML5 fügt weitere semantische Tags hinzu, wie z. B. Kopfzeile, Fußzeile, Navigation ... Wir müssen beim Schreiben der Seite nicht mehr die folgende Methode zum Layouten verwenden:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. <div class="header" >Das ist der Kopfdiv>
  2. <div class="content" >Dies ist der mittlere Inhaltsbereichdiv>
  3. <div class="footer" >Das ist das untere div>

Und Sie können es folgendermaßen gestalten:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. <Kopfzeile>Dies ist die KopfzeileKopfzeile>
  2. <Inhalt>Dies ist der mittlere InhaltsbereichInhalt>
  3. <Fußzeile>Das ist das Ende Fußzeile> 

Der IE unterstützt jedoch keine Weiterleitung. Wenn wir also möchten, dass er IE6, 7 und 8 unterstützt, müssen wir wie folgt einen kleinen Code in js und css hinzufügen:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. document.createElement("header"); document.createElement("content");
  2. document.createElement("footer");
  3. css:
Kopfzeile, Inhalt, Fußzeile{display:block}
Das Obige bedeutet, ein Tag als Header anzupassen und die Anzeige zu blockieren. Der vollständige Code ist unten angehängt:

XML/HTML-Code

Inhalt in die Zwischenablage kopieren
  1. >
  2. <html>
  3. <Kopf>
  4. <meta charset="utf- 8"> 
  5. <Titel>Verwenden Sie semantische Tags zum Schreiben Ihres HTML, kompatibel mit IE6,7, 8 Titel>
  6. <Stil> 
  7. *{margin:0;padding:0;}
  8. Kopfzeile, Inhalt, Fußzeile{display:block}
  9. Header{width:600px;height:150px;line-height:150px;border:1px solid #000;margin:10px auto;text-align:center;font-size:24px}
  10. content{width:600px;height:250px;line-height:250px;border:1px solid #000;margin:10px auto;text-align:center;font-size:24px}
  11. Fußzeile{width:600px;height:150px;line-height:150px;border:1px solid #000;margin:10px auto;text-align:center;font-size:24px}
  12. Stil>
  13. <Skript Typ="text/ Javascript"> 
  14. document.createElement("header");
  15. document.createElement("content");
  16. document.createElement("footer");
  17. Skript> Kopf>
  18. <
  19. Körper> <
  20. Kopfzeile>Dies ist die KopfzeileKopfzeile> <
  21. Inhalt>Dies ist der mittlere InhaltsbereichInhalt> <
  22. Fußzeile>Das ist das Ende Fußzeile> Körper> html>

    Lassen Sie uns über etwas reden, das nichts damit zu tun hat. Warum müssen wir HTML semantisch schreiben?

    Erstens ist der Code leicht zu lesen, und zweitens können Suchmaschinen-Crawler das für die Leistung verwendete Markup weitgehend ignorieren Fokus auf semantisches Markup.

    Also beeilen Sie sich und beginnen Sie mit dem Schreiben Ihres HTML-Codes mit semantischen Tags. Außerdem ist es nicht schwierig, oder?

    Anhang 1:

    Der obige Artikel verwendet semantische Tags zum Schreiben Ihres HTML und ist mit IE6, 7 und 8 kompatibel. Dies ist der gesamte vom Herausgeber geteilte Inhalt. Ich hoffe, er kann Ihnen eine Referenz geben und ich hoffe, dass Sie Script unterstützen Heim.

    Ursprüngliche Adresse: http://www.cnblogs.com/shouce/p/5385701.html

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage