Detaillierte Erläuterung der Meta-Tags und deren Verwendung in HTML

Das

-Element stellt Metainformationen über die Seite bereit, wie z. B. Beschreibung und Schlüsselwörter für Suchmaschinen und Aktualisierungshäufigkeit. Dieser Artikel stellt Ihnen hauptsächlich die detaillierte Erklärung von Meta-Tags und deren Verwendung in HTML vor. Interessierte Freunde sollten einen Blick darauf werfen. Ich hoffe, er kann Ihnen helfen.

Meta-Tag in HTML

1. Bedeutung des Meta-Tags

　 Das -Element kann Metainformationen über die Seite bereitstellen, z. B. für Suchmaschinen und Beschreibung und Schlüsselwörter für die Aktualisierungshäufigkeit.

　Das -Tag befindet sich am Kopf des Dokuments und enthält keinen Inhalt.

Die Attribute des -Tags definieren die mit dem Dokument verknüpften Name/Wert-Paare.

2. Häufig verwendete Attribute in Meta

1. Zeichensatz (Zeichensatz)

　 Beschreibung: Gibt die Zeichenkodierung von HTML-Dokumenten an.

Verwendung:

2. Ansichtsbereich

Beschreibung: Es ist der sichtbare Bereich der Webseite des Benutzers. Jeder weiß, dass der Bildschirm von Mobilgeräten im Allgemeinen viel kleiner ist als der von PCs. Webkit-Browser weisen dem Bildschirm von Mobilgeräten ein größeres „virtuelles“ Fenster zu. Das virtuelle Standardfenster ist 980 Pixel breit (der aktuelle Standard für die meisten Websites). . Breite) und dann entsprechend einem bestimmten Verhältnis (3:1 oder 2:1) skalieren.

Das heißt, wenn wir eine normale Webseite laden, lädt Webkit die Webseite zunächst gemäß dem Browserstandard von 980 Pixeln und reduziert sie dann auf eine Breite von 490 Pixeln. Beachten Sie, dass es sich bei dieser Reduzierung um eine globale Reduzierung handelt, d. h. alle Elemente auf der Seite werden reduziert.

Verwendung:

<meta id="viewport" name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1; user-scalable=no;">

(1) width

Width steuert die Größe des Ansichtsfensters und wird für Anpassungszwecke im Allgemeinen auf device-width

eingestellt ) Anfangsskalierung

　　　　Anfangsskalierung: Das anfängliche Skalierungsverhältnis, also das Skalierungsverhältnis, wenn die Seite zum ersten Mal geladen wird.

(3) Maximum-Scale

Maximum-Scale maximale Skalierung. Das heißt, der maximal zulässige Skalierungsgrad. Dies ist ebenfalls ein Gleitkommawert, der den maximalen Multiplikator der Seitengröße im Vergleich zur Bildschirmgröße angibt.

　　　(4) Minimum-Scale

　　　Minimum-Scale: Das Mindestverhältnis, auf das der Benutzer zoomen darf. Ähnlich wie bei maximaler Nutzung.

　　　(5) vom Benutzer skalierbar

　　　　　vom Benutzer skalierbar Der Benutzer passt den Zoom an. Das heißt, ob der Benutzer die Zoomstufe der Seite ändern kann. Wenn es auf „Ja“ gesetzt ist, darf der Benutzer es ändern, andernfalls ist es „Nein“.

3. Schlüsselwörter (Schlüsselwörter)

　Beschreibung: Eine Liste von Schlüsselwörtern, die für Suchmaschinen bereitgestellt werden. Trennen Sie jedes Schlüsselwort durch ein englisches Komma ",". Geben Sie Schlüsselwörter an, die Suchmaschinen verwenden, um die Suchqualität zu verbessern.

Verwendung:

4. Beschreibung (Beschreibung, Einführung )

Erläuterung: Die Beschreibung wird verwendet, um Suchmaschinen den Hauptinhalt Ihrer Website mitzuteilen.

Verwendung:

5. Formaterkennung (Formaterkennung)　

Erläuterung: Formaterkennung wird verwendet, um einige Formate in HTML zu erkennen.

Verwendung: Das Formaterkennungsattribut von Meta hat hauptsächlich die folgenden Einstellungen:

　meta name="format-detection" content="telephone=no"
　　　　meta name="format-detection" content="email=no"
　　　　meta name="format-detection" content="adress=no"

Sie können auch nacheinander schreiben: meta name="format-erkennung" content= "Telefon = nein, E -Mail = nein, acress = no"

Wahrscheinlichkeit in einem Linkstil, und das iPhone kann Ihrem Text automatisch einen Linkstil hinzufügen und auf die Nummer klicken, um die Nummer automatisch zu wählen! Wie entferne ich diesen DFÜ-Link? Zu diesem Zeitpunkt sollte unser Meta erneut seine magische Kraft zeigen. Der Code lautet wie folgt:

Telephone=no verbietet die Umwandlung von Nummern in Einwahllinks!

Telephone=yes ermöglicht die Konvertierung von Nummern in DFÜ-Links. Um die Konvertierungsfunktion zu aktivieren, ist es nicht erforderlich, dieses Meta zu schreiben. Es ist standardmäßig aktiviert.

　 (2) E-Mail

Weisen Sie das Gerät an, die E-Mail-Adresse nicht zu erkennen und sie nach dem Klicken nicht automatisch zu senden.

E-Mail=Nein ist als E-Mail-Adresse verboten!

Wenn email=yes aktiviert ist, wird der Text standardmäßig an die E-Mail-Adresse gesendet. Es ist nicht erforderlich, dieses Meta zu schreiben. Es ist standardmäßig aktiviert.

　(3) Adresse

　adress=no Der Sprung zur Karte ist verboten!

adress=yes aktiviert die Funktion, durch Klicken auf die Adresse direkt zur Karte zu springen. Sie ist standardmäßig aktiviert!

6. Apple-Touch-Vollbild

　Beschreibung: Nach dem Hinzufügen zum Startbildschirm wird es im Vollbildmodus angezeigt.

Verwendung:

7. apple-mobile-web-app-capable

Beschreibung: Die Funktion besteht darin, die standardmäßige Apple-Symbolleiste und Menüleiste zu löschen. Der Inhalt hat zwei Werte: „Ja“ und „Nein“. Wenn wir die Symbolleiste und die Menüleiste anzeigen müssen, ist es nicht erforderlich, diese Metazeile hinzuzufügen.

Verwendung:

8. App-Config

Beschreibung : Verlauf und Animationseffekte beibehalten

Verwendung:

9 . msapplication-tap-highlight

Beschreibung: Klicken ohne Hervorhebung (Hervorhebung)

Verwendung:

Verwandte Empfehlungen:

So implementieren Sie das Ansichtsfenster im Meta-Tag, um die CSS-Attribute des Gerätebildschirms zu steuern

HTML-Meta-Tag Verwendungszusammenfassung

Einführung in die allgemeine Verwendung von HTML-Meta-Tags

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der Meta-Tags und deren Verwendung in HTML. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!