suchen

Heim >Web-Frontend >HTML-Tutorial >Detaillierte Einführung in den HTML-Head-Tag

Detaillierte Einführung in den HTML-Head-Tag

巴扎黑
巴扎黑Original
2017-06-27 10:20:271721Durchsuche

Dieser Artikel basiert auf Yisis Artikel und bietet eine erweiterte Zusammenfassung, um die Bedeutung und Verwendungsszenarien jedes Tags und Elements in häufig verwendeten Überschriften vorzustellen. Im HTML-Kopfteil gibt es viele Tags und Elemente, die das Browser-Rendering von Webseiten, SEO usw. betreffen. Jeder Browserkern und jeder inländische Browserhersteller verfügt über eigene Tag-Elemente, was zu vielen Unterschieden führt. Im Zeitalter des mobilen Internets sind die Kopfstruktur und die Metaelemente mobiler Endgeräte noch wichtiger. Der Zweck dieses Artikels besteht darin, die Bedeutung jedes Tags zu verstehen und einen Head-Tag zu schreiben, der Ihren eigenen Anforderungen entspricht. Dieser Artikel basiert auf Yishis Artikel und bietet eine erweiterte Zusammenfassung, um die Bedeutung und Verwendungsszenarien jedes Tags und Elements in häufig verwendeten Überschriften vorzustellen.

DOCTYPE

DOCTYPE(Dokument Typ), diese Deklaration befindet sich an der vordersten Position im Dokument, vor dem HTML-Tag, diesem Tag informiert den Browser Welche HTML- oder XHTML-Spezifikation verwendet das Serverdokument?

Die DTD-Deklaration (Document Type Definition) beginnt mit , unterscheidet nicht zwischen Groß- und Kleinschreibung und hat keinen Inhalt davor. Wenn andere Inhalte vorhanden sind (außer Leerzeichen), öffnet der Browser ein seltsames Fenster Der Modus unter IE (Quirks-Modus) rendert Webseiten. Öffentliche DTD, das Namensformat ist Registrierung // Organisation // Typ-Tag // Sprache, Registrierung bezieht sich darauf, ob die Organisation bei der International Organization for Standardization (ISO) registriert ist, + bedeutet Ja, - bedeutet Nein. Organisation ist der Name der Organisation, z. B. W3C. Der Typ ist normalerweise DTD. Ein Tag gibt eine Beschreibung des öffentlichen Texts an, d. h. einen eindeutigen beschreibenden Namen für den referenzierten öffentlichen Text, dem eine Versionsnummer folgen kann. Die endgültige Sprache ist die ISO 639-Sprachkennung der DTD-Sprache, z. B. EN für Englisch, ZH für Chinesisch. XHTML 1.0 kann drei DTD-Typen deklarieren. Stellt eine strikte Version, eine Übergangsversion bzw. ein rahmenbasiertes HTML-Dokument dar.

●HTML 4.01 streng


XML/HTML Code Inhalt in die Zwischenablage kopieren

  1. >

●HTML 4.01 Transitional


XML/HTML-CodeInhalt in die Zwischenablage kopieren

  1. >

●HTML 4.01 Frameset


XML/HTML-CodeInhalt in die Zwischenablage kopieren

  1. >

●Das neueste HTML5 führt prägnanteres Schreiben ein. Es ist vorwärts- und rückwärtskompatibel und wird zur Verwendung empfohlen.




XML/HTML-CodeInhalt in die Zwischenablage kopieren

  1. >
doctype hat in HTML zwei Hauptzwecke.

●Überprüfen Sie die Gültigkeit der Dokumente.

Es teilt dem Benutzeragenten und Validator mit, nach welcher DTD dieses Dokument geschrieben ist. Diese Aktion ist passiv. Der Browser lädt die DTD nicht herunter und überprüft die Gültigkeit. Sie wird nur aktiviert, wenn die Seite manuell überprüft wird.

●Bestimmen Sie den Rendering-Modus des Browsers

Für tatsächliche Vorgänge teilen Sie dem Browser mit, welcher Parsing-Algorithmus beim Lesen des Dokuments verwendet werden soll. Wenn es nicht geschrieben wird, analysiert der Browser den Code nach seinen eigenen Regeln, was das HTML-Layout ernsthaft beeinträchtigen kann. Browser haben drei Möglichkeiten, HTML-Dokumente zu analysieren.

●Nicht-seltsamer (Standard-)Modus

●Seltsamer Modus
●Teilweise seltsamer (fast Standard-)Modus Informationen zum Dokumentmodus, Browsermodus und strikten Modus des
IE-Browsers , seltsamer Modus, DOCTYPE-Tag, ausführlicher Modus? Standard! Inhalt.

charset

deklariert die im Dokument verwendete Zeichenkodierung,


XML/HTML-Code Inhalt in die Zwischenablage kopieren

  1. <meta charset="utf-8">

html5 Die vorherige Webseite würde so schreiben:


XML/HTML-CodeInhalt in die Zwischenablage kopieren

  1. <meta http-equiv="Inhalt - Geben Sie „ content=“text/html; charset=utf-8“>

Diese beiden sind gleichwertig. Sie können die Details Schritt für Schritt lesen: , daher wird empfohlen, das zu verwenden kürzerer Speicher, der einfacher zu verwenden ist.



lang-Attribut

Vereinfachtes Chinesisch


XML/HTML-Code Inhalt in die Zwischenablage kopieren

  1. <html lang=" zh -cmn-Hans">

　Traditionelles Chinesisch


XML / HTML-CodeInhalt in die Zwischenablage kopieren

  1. <html lang= "zh-cmn-Hant">

Warum lang="zh-cmn-Hans" anstelle dessen, was wir normalerweise als schreiben Für lang="zh-CN" lesen Sie bitte weiter: Die Anweisung am Kopf der Seite sollte lang="zh" oder lang="zh-cn" lauten.


Bevorzugen Sie die neueste Version von IE und Chrome


XML/HTML-CodeInhalt in die Zwischenablage kopieren

  1. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

　360 Use Google Chrome Frame


XML/HTML-CodeInhalt in die Zwischenablage kopieren

  1. < ; Meta Name="Renderer" Inhalt="Webkit"> 🎜>

    2. Der 360-Browser wechselt nach dem Lesen dieses Tags sofort zum entsprechenden Geschwindigkeitskern. Fügen Sie außerdem


XML/HTML-Code

Inhalt in die Zwischenablage kopieren

    <

  1. meta http-equiv="X-UA-Compatible" content= "IE =Edge,chrome=1"> Der Effekt, der durch diese Schreibweise erzielt werden kann, besteht darin, dass, wenn Google Chrome Frame installiert ist, dann Verwenden Sie GCF zum Rendern der Seite. Wenn GCF nicht installiert ist, verwenden Sie zum Rendern die höchste Version des IE-Kernels.

Verwandte Links: Browser-Kernel-Steuerung Meta-Tag-Dokumentation

Baidu verbietet Transkodierung


Wenn Sie eine Webseite über ein Baidu-Mobiltelefon öffnen, kann Baidu Ihre Webseite transkodieren oder Ihre Kleidung ausziehen und eine Werbung für Hundehautpflaster auf Ihren Körper kleben. Zu diesem Zweck können Sie




XML/HTML-Code

hinzufügen Inhalt in die Zwischenablage kopieren

  1. <meta http-equiv="Cache-Control" Inhalt="no-siteapp" />

Verwandte Links: SiteApp Transcoding Statement


SEO-Optimierungsteil

Seitentitel-Tag (Header ist erforderlich) <br><br></p> <p class="codeText"><br></p> <p class="codeHead"> <span class="lantxt">XML/HTML-Code</span><span style="CURSOR: pointer" class="copyCodeText">Inhalt in die Zwischenablage kopieren</span></p> <ol class="dp-xml list-paddingleft-2"><li><p><span class="tag"><</span><span class="tag-name">Titel</span><span class="tag">> </span>Ihr Titel<span class="tag"></</span><span class="tag-name">Titel</span><span class="tag">></span></p></li></ol> <p>SeitenschlüsselwörterSchlüsselwörter <br><br></p> <p class="codeText"><br></p> <p class="codeHead"><span class="lantxt">XML/HTML-Code</span><span style="CURSOR: pointer" class="copyCodeText">Inhalt in die Zwischenablage kopieren</span></p> <ol class="dp-xml list-paddingleft-2"><li><p><span class="tag">< ;</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"keywords"</span> <span class="attribute">content</span>=<span class="attribute-value">"your keywords"</span><span class="tag">> ;</span></p></li></ol> <p><br>Inhaltsbeschreibung der Seitenbeschreibung <br></p> <p class="codeText"><br></p> <p class="codeHead"><span class="lantxt">XML/HTML-Code</span><span style="CURSOR: pointer" class="copyCodeText">Inhalt in die Zwischenablage kopieren</span></p> <ol class="dp-xml list-paddingleft-2"><li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">" Beschreibung"</span> <span class="attribute">Inhalt</span>=<span class="attribute-value">"Ihre Beschreibung"</span><span class="tag">></span></p></li></ol> <p> Definieren Sie den Autor der Webseite <br> </p> <p class="codeText"><br></p> <p class="codeHead"><span class="lantxt">XML/HTML-Code</span><span style="CURSOR: pointer" class="copyCodeText">Inhalt in die Zwischenablage kopieren</span></p> <ol class="dp-xml list-paddingleft-2"><li><p><span class="tag"> <</span><span class="tag-name">Meta</span> <span class="attribute">Name</span>=<span class="attribute-value">"Autor"</span> <span class="attribute">Inhalt</span>=<span class="attribute-value">"Autor, E-Mail-Adresse"</span><span class="tag">></span></p></li></ol> <p>Definieren Sie die Indexierungsmethode für Websuchmaschinen als eine Reihe von Werten, die durch englische Kommas "," getrennt sind, normalerweise mit den folgenden Werten Zur Verfügung stehen: none, noindex, nofollow, all, index und follow. <br><br><span class="lantxt">XML/HTML-Code</span><span style="CURSOR: pointer" class="copyCodeText">Inhalt in die Zwischenablage kopieren</span></p> <p class="codeText"><br></p> <ol class="dp-xml list-paddingleft-2"><li><p><span class="tag"> <</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"robots"</span> <span class="attribute">content</span>=<span class="attribute-value">"index,follow"</span><span class="tag">></span></p></li></ol> <p>Verwandte Links: WEB1038 – Tag enthält ungültigen Wert <br><br><strong><a href="http://www.php.cn/css/css-rwd-viewport.html" target="_blank">Ansichtsfenster</a></strong></p> <p>　Viewport kann die Layoutdarstellung in mobilen Browsern verbessern. Schreiben Sie normalerweise </p> <p class="codeText"><br></p> <p class="codeHead"><span class="lantxt">XML/HTML-Code</span><span style="CURSOR: pointer" class="copyCodeText">Inhalt in die Zwischenablage kopieren</span></p> <ol class="dp-xml list-paddingleft-2"><li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"viewport"</span> <span class="attribute">content</span>=<span class="attribute-value">"width=device-width , initial -scale=1.0"</span><span class="tag">></span></p></li></ol> <p>width=device-width führt dazu, dass das iPhone 5 die Seite nach dem Hinzufügen im WebApp-Vollbildmodus öffnet zum Startbildschirm Es erscheinen schwarze Ränder (http://bigc.at/ios-webapp-viewport-meta.orz)</p> <p>content Parameters: </p> <p>width viewport width (value/device-width )<br>Höhe des Ansichtsfensters (numerischer Wert/Gerätehöhe)<br>anfängliches Skalierungsverhältnis<br>maximales Skalierungsverhältnis maximales Skalierungsverhältnis<br>minimales Skalierungsverhältnis minimales Skalierungsverhältnis<br>vom Benutzer skalierbar, ob dies der Fall sein soll Benutzerskalierung zulassen (ja/nein)<br>minimal-ui Ein neues Attribut in iOS 7.1 Beta 2 kann die obere und untere Statusleiste beim Laden der Seite minimieren. Dies ist ein boolescher Wert und kann direkt wie folgt geschrieben werden: </p> <p class="codeText"><br></p> <p class="codeHead"><span class="lantxt">XML/HTML-Code</span><span style="CURSOR: pointer" class="copyCodeText">Inhalt in die Zwischenablage kopieren</span></p> <ol class="dp-xml list-paddingleft-2"><li><p><span class="tag"><</span><span class="tag-name">Meta</span> <span class="attribute">name</span>=<span class="attribute-value">"viewport"</span> <span class="attribute">content</span>=<span class="attribute-value">"width=device-width, initial-scale=1, minimal-ui"</span><span class="tag">></span></p></li></ol> <p>Und wenn Ihre Website nicht reagiert, verwenden Sie bitte nicht die Anfangsskalierung oder deaktivieren Sie die Skalierung. </p> <p class="codeText"><br></p> <p class="codeHead"><span class="lantxt">XML/HTML-Code</span><span style="CURSOR: pointer" class="copyCodeText">Inhalt in die Zwischenablage kopieren</span></p> <ol class="dp-xml list-paddingleft-2"><li><p><span class="tag"> <</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"viewport"</span> <span class="attribute">content</span>=<span class="attribute-value">"width=device-width,user- scalable =ja"</span><span class="tag">></span></p></li></ol> <p>Verwandte Links: Nicht-responsives Design-Ansichtsfenster <br><br> An iPhone 6 und iPhone 6plus angepasst, dann erforderlich Schreiben Sie: <br><span class="lantxt"><br>XML/HTML-Code</span><span style="CURSOR: pointer" class="copyCodeText">Inhalt in die Zwischenablage kopieren</span></p> <p class="codeText"><br></p> <ol class="dp-xml list-paddingleft-2"> <li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"viewport"</span> <span class="attribute">content</span>=<span class="attribute-value">"width=375"</span> <span class="tag">></span></p></li> <li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"viewport"</span> <span class="attribute">Inhalt</span>=<span class="attribute-value">"width=414"</span><span class="tag">></span></p></li> </ol> <p>Meistens 4,7~5 Zoll Die Breite des Ansichtsfensters von Bei Android-Geräten ist die Auflösung auf 360 Pixel eingestellt, auf dem iPhone 6 jedoch auf 375 Pixel. Die Ansichtsbreite der meisten 5,5-Zoll-Android-Geräte (z. B. Samsung Note) beträgt 400 Pixel und auf dem iPhone 6 Plus 414 Pixel. <br><br><strong> iOS-Geräte <br><br></strong> Titel zum Startbildschirm hinzugefügt (neu für iOS 6) </p> <p class="codeText"><br></p> <p class="codeHead"><span class="lantxt"> XML/HTML-Code</span><span style="CURSOR: pointer" class="copyCodeText">Inhalt in die Zwischenablage kopieren</span></p> <ol class="dp-xml list-paddingleft-2"><li><p><span class="tag"><</span><span class="tag-name">Meta</span> <span class="attribute">Name</span>=<span class="attribute-value">"apple-mobile-web-app-title"</span> <span class="attribute">content</span>=<span class="attribute-value">"title"</span><span class="tag">></span> <span class="comments">< -- Titel zum Startbildschirm hinzugefügt (neu in iOS 6) --></span></p></li></ol> <p><br>Ob der WebApp-Vollbildmodus aktiviert werden soll</p> <p class="codeText"> <br></p> <p class="codeHead"><span class="lantxt">XML/HTML-Code</span><span style="CURSOR: pointer" class="copyCodeText">Inhalt in die Zwischenablage kopieren</span></p> <ol class="dp-xml list-paddingleft-2"><li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"apple-mobile-web-app-capable"</span> <span class="attribute">content</span>=<span class="attribute-value">"yes"</span> <span class="tag"> /></span> <span class="comments"><!-- Ob der WebApp-Vollbildmodus aktiviert werden soll --></span></p></li></ol> <p>Hintergrundfarbe der Statusleiste festlegen</p> <p class="codeText"> <br></p> <p class="codeHead"><span class="lantxt">XML/HTML-Code</span><span style="CURSOR: pointer" class="copyCodeText">Inhalt in die Zwischenablage kopieren</span></p> <ol class="dp-xml list-paddingleft-2"> <li><p><span class="tag">< ;</span> <span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"apple-mobile-web-app-status-bar-style"</span> <span class="attribute">content</span>=<span class="attribute-value">"schwarz- durchscheinend"</span> <span class="tag">/></span></p></li> <li><p><span class="comments"><!-- Legen Sie die Hintergrundfarbe der Statusleiste fest, nur in ` „apple-mobile-web Effektiv, wenn -app-capable“ content="yes"` --></span></p></li> </ol> <p>Wird nur wirksam, wenn „apple-mobile-web-app-capable“ content="yes" <br><br>　Inhaltsparameter: <br><br>Standardwert. <br>schwarz Der Hintergrund der Statusleiste ist schwarz. <br>schwarz-durchscheinend Der Hintergrund der Statusleiste ist schwarz und durchscheinend. Bei der Einstellung „Standard“ oder „Schwarz“ beginnt der Webinhalt unten in der Statusleiste. Bei der Einstellung Schwarz-Transluzent füllt der Webseiteninhalt den gesamten Bildschirm aus und der obere Teil wird durch die Statusleiste verdeckt. <br><br><strong>Ziffernerkennung als Telefonnummer deaktivieren</strong></p> <p class="codeText"><br></p> <p class="codeHead"><span class="lantxt">XML/HTML-Code</span><span style="CURSOR: pointer" class="copyCodeText">Inhalt in die Zwischenablage kopieren </span></p> <ol class="dp-xml list-paddingleft-2"> <li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"format-erkennung"</span> <span class="attribute">content</span>=<span class="attribute-value">"telephone=no"</span> <span class="tag">/></span> <span class="comments"><!-- Ziffernerkennung als Telefonnummer deaktivieren --> 🎜></span></p></li>iOS-Symbol</ol> <p>　rel-Parameter: apple-touch-icon </p>Bild<p> wird automatisch in Effekte wie abgerundete Ecken und Hervorhebungen verarbeitet. apple-touch-icon-precomposed verhindert, dass das System automatisch Effekte hinzufügt, und zeigt das ursprüngliche Design direkt an. iPhone und iTouch, standardmäßig 57 x 57 Pixel, müssen den folgenden <a href="http://www.php.cn/css/css-rwd-images.html" target="_blank"></a>-Code haben: </p> <p><link rel="apple-touch-icon-precomposed" href="/apple-touch-icon- 57x57 -precomposed.png" /> <!-- iPhone und iTouch, Standard 57x57 Pixel, muss--></p> <p class="msgborder"><br> iPad, 72x72 Pixel, optional, aber empfohlen </p> <p>Der Code lautet wie folgt:</p> <p><link rel="apple-touch-icon-precomposed" size="72x72" href="/apple-touch-icon-72x72-precomposed.png" / > <!-- iPad, 72x72 Pixel, optional, aber empfohlen--></p> <p class="msgborder"><br> Retina iPhone und Retina iTouch, 114x114 Pixel, optional, aber empfohlen </p> <p> Der Code lautet wie folgt:</p> <p><link rel="apple-touch-icon-precomposed" size="114x114" href="/apple-touch-icon-114x114-precomposed.png" /> ! -- Retina iPhone und Retina iTouch, 114x114 Pixel, optional, aber empfohlen --></p> <p class="msgborder"><br> Retina iPad, 144x144 Pixel, optional, aber empfohlen </p> <p>Der Code lautet wie folgt :</p> <p><link rel="apple-touch-icon-precomposed" size="144x144" href="/apple-touch-icon-144x144-precomposed.png" /> Retina iPad, 144 x 144 Pixel, optional, aber empfohlen –></p> <p class="msgborder"><br> Die IOS-Symbolgröße beträgt 180 x 180 auf dem iPhone 6 Plus und 120 x 120 auf dem iPhone 6. Zur Anpassung an das iPhone 6 Plus müssen Sie diesen </p> <p>-Code wie folgt hinzufügen: </p> <p><link rel="apple-touch-icon-precomposed" size="180x180" href= " retinahd_icon.png"></p> <p class="msgborder"><br></p>iOS-Begrüßungsbildschirm<p><strong><br>Offizielle Dokumentation: <br>https://</strong>developer.apple.com/ Bibliothek /ios/qa/qa1686/_index.html <a href="http://www.php.cn/wiki/373.html" target="_blank">Referenzartikel: http://wxd.ctrip.com/blog/2013/09/ios7-hig-24/ </a><br>Der Startbildschirm des iPad ist Mit Ausnahme des Statusleistenbereichs. <br><br>iPad-Hochformatbildschirm 768 x 1004 (Standardauflösung) </p> <p>Der Code lautet wie folgt:</p> <p><link rel="apple-touch-startup-image"sizes= "768x1004 " href="/splash-screen-768x1004.png" /> <!-- iPad vertikaler Bildschirm 768 x 1004 (Standardauflösung) --></p> <p class="msgborder"><br>　iPad vertikaler Bildschirm 1536x2008 ( Netzhaut</p> <p>Der Code lautet wie folgt:</p> <p><link rel="apple-touch-startup-image" size="1536x2008" href="/splash-screen-1536x2008.png " /> <!-- iPad-Hochformatbildschirm 1536x2008 (Retina) --></p> <p class="msgborder"><br> iPad-Querformatbildschirm 1024x748 (Standardauflösung) </p> <p>Der Code lautet wie folgt:</p> <p>< ;link rel="apple-touch-startup-image" size="1024x748" href="/Default-Portrait-1024x748.png" /> <!-- iPad Querformat 1024x748 (Standardauflösung ) --> ;</p><p class="msgborder"><br/> iPad-Querformatbildschirm 2048x1496 (Retina) </p><p>Der Code lautet wie folgt:</p><p><link rel="apple-touch-startup -image" size="2048x1496 " href="/splash-screen-2048x1496.png" /> <!-- iPad-Querformatbildschirm 2048x1496 (Retina) --></p> <p class="msgborder"><br> Der Start Bildschirm von iPhone und iPod touch ist enthalten </p> <p>iPhone/iPod Touch-Hochformatbildschirm 320x480 (Standardauflösung) </p> <p>Der Code lautet wie folgt:</p> <p class="msgborder"><link rel="apple-touch-startup-image" href="/splash-screen-320x480.png" /> <!-- iPhone/iPod Touch-Hochformatbildschirm 320x480 (Standardauflösung) - - ><br></p> <p>iPhone/iPod Touch-Hochformatbildschirm 640x960 (Retina)</p> <p>Der Code lautet wie folgt:</p> <p class="msgborder"><link rel="apple-touch-startup -image " size="640x960" href="/splash-screen-640x960.png" /> <!-- iPhone/iPod Touch-Hochformatbildschirm 640x960 (Retina) --><br></p> <p>　iPhone 5/iPod Touch 5 vertikaler Bildschirm 640x1136 (Retina)</p> <p>Der Code lautet wie folgt:</p> <p class="msgborder"><link rel="apple-touch-startup-image" size="640x1136" href="/splash -screen-640x1136.png" /> <!-- iPhone 5/iPod Touch 5 vertikaler Bildschirm 640x1136 (Retina) --><br></p> <p> Smart App Advertising Banner hinzufügen Smart App Banner (iOS 6+ Safari) </p> <p>Der Code lautet wie folgt:</p> <p class="msgborder"><meta name="apple-itunes-app" content="app-id=myAppStoreID, Affiliate- data=myAffiliateData, app-argument= myURL"> <!-- Smart App Advertising Banner hinzufügen Smart App Banner (iOS 6+ Safari) --><br></p> <p>　Die entsprechende Bildgröße für das iPhone 6 ist 750×1294, und für das iPhone 6 Plus beträgt das entsprechende 1242×2148. </p> <p>Der Code lautet wie folgt:</p> <p class="msgborder"><link rel="apple-touch-startup-image" href="launch6.png" media="(device-width: 375px)" ><br><link rel="apple-touch-startup-image" href="launch6plus.png" media="(device-width: 414px)"><br></p> <p><strong>Windows 8 <br></strong>　Windows 8-Kachelfarbe</p> <p>Der Code lautet wie folgt:</p> <p class="msgborder"><meta name="msapplication-TileColor" content="#000"/> <!-- Windows 8-Kachelfarbe--><br></p> <p>　Windows 8-Kachelsymbol</p> <p>Der Code lautet wie folgt:</p> <p class="msgborder"><meta name=" msapplication-TileImage" content= "icon.png"/> <!-- Windows 8 Kachelsymbol--><br></p> <p>　RSS-Abonnement</p> <p>Der Code lautet wie folgt: </p> <p class="msgborder">< link rel="alternate" type="application/rss+xml" title="RSS" href="/rss.xml" <!-- RSS-Abonnement hinzufügen--> ;<br/></p><p>　Favicon-Symbol</p><p>Der Code lautet wie folgt:</p><p class="msgborder"><link rel="shortcut icon" type="image/ico" href="/ favicon.ico" /> <!- - Favicon-Symbol hinzufügen --><br></p> <p>Eine detailliertere Einführung in Favicon finden Sie unter https://github.com/audreyr/favicon -Spickzettel<br><br><strong>Mobile-Version-Meta <br></strong><span class="lantxt">XML/HTML-Code</span><span style="CURSOR: pointer" class="copyCodeText">Inhalt in die Zwischenablage kopieren</span></p> <ol class="dp-xml list-paddingleft-2"> <li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"viewport"</span> <span class="attribute">content</span>=<span class="attribute-value">"width= device-width, initial-scale=1, user-scalable= no"</span> <span class="tag">/></span></p></li> <li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"apple-mobile-web-app-capable"</span> <span class="attribute">content</span>=<span class="attribute-value">"yes"</span> <span class="tag"> /></span></p></li> <li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"apple-mobile-web -app-status-bar-style"</span> <span class="attribute">content</span>=<span class="attribute-value">"black"</span> <span class="tag">/></span></p></li> <li><p> <span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">name</span>="format-detection"<span class="attribute-value">content</span>="<span class="attribute">telephone</span>=<span class="attribute-value">no</span>, <span class="attribute">E-Mail</span>=<span class="attribute-value">nein</span>" <span class="tag">/></span></p></li> <li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"viewport"</span> <span class="attribute">content</span>=<span class="attribute-value">"width=device-width, initial-scale=1, user-scalable= nein"</span> <span class="tag">/></span> </p></li> <li> <p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"apple-mobile-web-app-capable"</span> <span class="attribute">content</span>=<span class="attribute-value">"yes"</span> <span class="tag">/></span><span class="comments"><!-- Apples Standardsymbolleiste und Menüleiste löschen --></span></p> </li> <li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"apple-mobile-web-app-status-bar- style" </span> <span class="attribute">content</span>=<span class="attribute-value">"black"</span> <span class="tag">/></span><span class="comments"><!-- Farbe der Apple-Symbolleiste festlegen --></span></p></li> <li><p><span class="tag"><</span><span class="tag-name">Meta</span> <span class="attribute">Name</span>=<span class="attribute-value">"Formaterkennung"</span> <span class="attribute">Inhalt</span>=<span class="attribute-value">"telphone=no, email=no"</span> <span class="tag">/></span><span class="comments"><!-- Ignorieren Sie die Nummern auf der Seite und identifizieren Sie sie als Telefonnummern, ignorieren Sie E-Mails Identifikation - -></span></p></li> <li><p><span class="comments"><!-- Aktivieren Sie den Geschwindigkeitsmodus des 360-Browsers (Webkit) --></span></p></li> <li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"renderer"</span> <span class="attribute">content</span>=<span class="attribute-value">"webkit "</span><span class="tag">></span></p></li> <li> <p><span class="comments"><!-- Vermeiden Sie den IE im Kompatibilitätsmodus --></span></p> </li> <li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">http-equiv</span>=<span class="attribute-value">"X-UA-Compatible"</span> <span class="attribute"> Inhalt</span>=<span class="attribute-value">"IE=edge"</span><span class="tag">></span></p></li> <li><p><span class="comments"><!-- Hauptsächlich für Handheld-Geräte optimiert für einige alte Browser, die das Ansichtsfenster nicht erkennen, wie z. B. BlackBerry --></span></p></li> <li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute"> Name</span>=<span class="attribute-value">"HandheldFriendly"</span> <span class="attribute">Inhalt</span>=<span class="attribute-value">"true"</span><span class="tag">></span></p></li> <li><p><span class="comments"><!-- Microsofts alter Browser --></span></p></li> <li><p><span class="tag"><</span><span class="tag-name">Meta</span> <span class="attribute">Name </span>=<span class="attribute-value">"MobileOptimized"</span> <span class="attribute">Inhalt</span>=<span class="attribute-value">"320"</span><span class="tag">></span></p></li> <li><p> <span class="comments"><!-- uc force vertikaler Bildschirm --></span></p></li> <li><p><span class="tag"><</span><span class="tag-name">Meta</span> <span class="attribute">Name </span>=<span class="attribute-value">"screen-orientation"</span> <span class="attribute">content</span>=<span class="attribute-value">"portrait"</span><span class="tag">></span></p></li> <li><p><span class="comments"><!--QQ erzwungener vertikaler Bildschirm --></span></p></li> <li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"x5-orientation"</span> <span class="attribute">content</span>=<span class="attribute-value">"portrait"</span><span class="tag">></span></p></li> <li><p><span class="comments"><!-- UC erzwungener Vollbildmodus --></span></p></li> <li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">Name</span>=<span class="attribute-value">"Vollbild"</span> <span class="attribute">Inhalt</span>=<span class="attribute-value">"Ja"</span><span class="tag">></span></p></li> <li><p><span class="comments"><!-- QQ erzwungener Vollbildmodus --></span></p></li> <li><p><span class="tag"><</span><span class="tag-name">Meta</span> <span class="attribute">Name</span>=<span class="attribute-value">"x5-fullscreen"</span> <span class="attribute">Inhalt</span>=<span class="attribute-value">"true"</span><span class="tag">></span></p></li> <li><p><span class="comments"><!-- UC-Anwendungsmodus --></span></p></li> <li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"browsermode"</span> <span class="attribute">content</span>=<span class="attribute-value">"Anwendung"</span><span class="tag">></span></p></li> <li><p><span class="comments"><!-- QQ-Anwendungsmodus --></span></p></li> <li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"x5-page-mode"</span> <span class="attribute">content</span>=<span class="attribute-value">"app"</span><span class="tag">></span></p></li> <li><p><span class="comments"><!-- Windows Phone-Klick ohne Hervorhebung --></span></p></li> <li><p><span class="tag"><</span><span class="tag-name">meta</span> <span class="attribute">name</span>=<span class="attribute-value">"msapplication-tap-highlight"</span> <span class="attribute">Inhalt</span>=<span class="attribute-value">"nein"</span><span class="tag">></span></p></li> <li><p><span class="comments"><!-- An mobile Seite anpassen -- ></span></p></li> </ol> <p>Dies ist eine Zusammenfassung des Teilens von toobug. </p> <p>　Weitere Meta-Tag-Referenzen</p> <ul class=" list-paddingleft-2"> <li><p>VOLLSTÄNDIGE LISTE DER HTML-META-TAGS</p></li> <li><p>18 Meta-Tags, die jede Webseite im Jahr 2013 haben sollte</p></li> </ul> <p> Referenzartikel: </p> <ul class=" list-paddingleft-2"> <li><p>Häufig verwendete HTML-Header-Tags</p></li> <li> <p>html5_header</p> </li> <li><p>amazeui css</p></li> <li><p>DOCTYPE</p></li> <li><p>10 neue IOS 8-Änderungen, die WEB-Ingenieure und Designer lernen müssen </p></li> </ul><p>Das obige ist der detaillierte Inhalt vonDetaillierte Einführung in den HTML-Head-Tag. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!</p></div><div class="nphpQianMsg"><div class="clear"></div></div><div class="nphpQianSheng"><span>Stellungnahme：</span><div>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</div></div></div><div class="nphpSytBox"><span>Vorheriger Artikel：<a class="dBlack" title="Detaillierte Einführung in das <head>-Tag und seinen Inhalt in HTML" href="https://m.php.cn/de/faq/370785.html">Detaillierte Einführung in das <head>-Tag und seinen Inhalt in HTML</a></span><span>Nächster Artikel：<a class="dBlack" title="Detaillierte Einführung in das <head>-Tag und seinen Inhalt in HTML" href="https://m.php.cn/de/faq/370796.html">Detaillierte Einführung in das <head>-Tag und seinen Inhalt in HTML</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>In Verbindung stehende Artikel</h2><em><a href="https://m.php.cn/de/article.html" class="bBlack"><i>Mehr sehen</i><b></b></a></em><div class="clear"></div></div><ins class="adsbygoogle" style="display:block" data-ad-format="fluid" data-ad-layout-key="-6t+ed+2i-1n-4w" data-ad-client="ca-pub-5902227090019525" data-ad-slot="8966999616"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><ul class="nphpXgwzList"><li><b></b><a href="https://m.php.cn/de/faq/348757.html" title="Zusammenfassung der HTML-Kenntnisse" class="aBlack">Zusammenfassung der HTML-Kenntnisse</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/de/faq/348804.html" title="So lernen Sie schnell HTML" class="aBlack">So lernen Sie schnell HTML</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/de/faq/348873.html" title="Der Unterschied zwischen HTML xHTML XML" class="aBlack">Der Unterschied zwischen HTML xHTML XML</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/de/faq/348884.html" title="Der Unterschied zwischen src- und href-Attributen" class="aBlack">Der Unterschied zwischen src- und href-Attributen</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/de/faq/348902.html" title="Über die Verwendung von HTML5 und CSS-Ersatz" class="aBlack">Über die Verwendung von HTML5 und CSS-Ersatz</a><div class="clear"></div></li></ul></div></div><ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-5902227090019525" data-ad-slot="5027754603"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><footer><div class="footer"><div class="footertop"><img src="/static/imghwm/logo.png" alt=""><p>Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！</p></div><div class="footermid"><a href="https://m.php.cn/de/about/us.html">Über uns</a><a href="https://m.php.cn/de/about/disclaimer.html">Haftungsausschluss</a><a href="https://m.php.cn/de/update/article_0_1.html">Sitemap</a></div><div class="footerbottom"><p> © php.cn All rights reserved </p></div></div></footer><script>isLogin = 0;</script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script></div><script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script><link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css' type='text/css' media='all'/><script type='text/javascript' src='/static/js/viewer.min.js?1'></script><script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script><script>jQuery.fn.wait = function (func, times, interval) { var _times = times || -1, //100次 _interval = interval || 20, //20毫秒每次 _self = this, _selector = this.selector, //选择器 _iIntervalID; //定时器id if( this.length ){ //如果已经获取到了，就直接执行函数 func && func.call(this); } else { _iIntervalID = setInterval(function() { if(!_times) { //是0就退出 clearInterval(_iIntervalID); } _times <= 0 || _times--; //如果是正数就 -- _self = $(_selector); //再次选择 if( _self.length ) { //判断是否取到 func && func.call(_self); clearInterval(_iIntervalID); } }, _interval); } return this; } $("table.syntaxhighlighter").wait(function() { $('table.syntaxhighlighter').append("<p class='cnblogs_code_footer'><span class='cnblogs_code_footer_icon'></span></p>"); }); $(document).on("click", ".cnblogs_code_footer",function(){ $(this).parents('table.syntaxhighlighter').css('display','inline-table');$(this).hide(); }); $('.nphpQianCont').viewer({navbar:true,title:false,toolbar:false,movable:false,viewed:function(){$('img').click(function(){$('.viewer-close').trigger('click');});}}); </script></body></html>