Maison >interface Web >tutoriel HTML >Qu'est-ce que la balise méta en HTML ? Quelles sont les propriétés?

Qu'est-ce que la balise méta en HTML ? Quelles sont les propriétés?

清浅
清浅original
2019-04-27 16:25:1623858parcourir

Meta en HTML signifie « méta ». Il s'agit d'une balise auxiliaire dans la zone d'en-tête. Elle ne contient aucun contenu et est utilisée pour fournir des méta-informations sur la page, comme pour les moteurs de recherche et la fréquence de mise à jour. . Description et mots-clés ; les attributs de la balise méta définissent les paires nom/valeur associées au document.

Qu'est-ce que la balise méta en HTML ? Quelles sont les propriétés?

La balise méta en HTML est une balise auxiliaire dans la zone d'en-tête. Elle est généralement utilisée pour les descriptions de pages, les mots-clés et autres métadonnées. navigateurs, moteurs de recherche, etc. Il possède quatre attributs : l'attribut de nom, l'attribut http-equiv, l'attribut de contenu et l'attribut de schéma.

Dans le processus d'apprentissage du front-end, l'essentiel de la compréhension des balises méta est 1fc2df4564f5324148703df3b6ed50c1. Nous verrons cette phrase lorsque nous ouvrirons un site Web, mais nous ne le faisons pas. Je ne connais pas les balises méta. Comment les connaissez-vous ? Ensuite, je présenterai cette étiquette en détail dans l'article, qui a un certain effet de référence.

[Cours recommandé : Tutoriel HTML]

introduction de la balise méta

la balise méta est HTML Une balise auxiliaire dans la zone d'en-tête de langue, souvent utilisée pour définir la description de la page, les mots-clés, la date de dernière modification et d'autres métadonnées. Ces métadonnées seront transmises aux navigateurs, moteurs de recherche et autres services Web.

La composition de la balise méta

la balise méta a deux attributs, à savoir l'attribut http-equiv et l'attribut name.

attribut name

L'attribut name est principalement utilisé pour décrire les pages Web, tels que les mots-clés, les récits, etc. La valeur d'attribut correspondante est content. Le contenu dans content est une description spécifique du type d'entrée de nom, ce qui est pratique à explorer pour les moteurs de recherche. Le format de syntaxe de l'attribut name dans la

balise méta est :

<meta name="参数" content="具体的描述">

L'attribut name a les paramètres suivants. (A-C sont des attributs communs)

(1) mots-clés (mots-clés)

Description : Utilisé pour indiquer aux moteurs de recherche les mots-clés de votre page Web. Exemple :

<meta name="keywords" content="PHP中文网">

(2) description (description du contenu du site Web)

Description : Utilisé pour indiquer aux moteurs de recherche le contenu principal de votre site Web. Exemple :

<meta name="description" content="php中文网提供大量免费、原创、高清的php视频教程">

(3) viewport (fenêtre du terminal mobile)

Explication : Ce concept est relativement complexe et sera abordé en détail dans le prochain article de blog. Cet attribut est souvent utilisé dans la conception de pages Web mobiles. Viewport a été utilisé lors de l'utilisation de frameworks tels que bootstrap et AmazeUI.

<meta name="viewport" content="width=device-width, initial-scale=1">

(4) robots (définissent la méthode d'indexation des robots des moteurs de recherche)

Description : les robots sont utilisés pour indiquer aux robots quelles pages doivent être indexées et quelles pages n’ont pas besoin d’être indexés. Les paramètres de contenu incluent all, none, index, noindex, follow et nofollow. La valeur par défaut est tout.

<meta name="robots" content="none">

Les paramètres spécifiques sont les suivants :

1 : aucun : les moteurs de recherche ignoreront cette page Web, ce qui équivaut à noindex et nofollow.
2. noindex : Les moteurs de recherche n’indexent pas cette page.
3. nofollow : les moteurs de recherche ne continuent pas à rechercher d'autres pages Web via l'index de liens de cette page Web.
4. tous : le moteur de recherche indexera cette page Web et continuera à indexer les liens via cette page Web, ce qui équivaut à indexer et suivre.
5. Index : Les moteurs de recherche indexent cette page Web.
6. suivre : le moteur de recherche continue de rechercher d'autres pages Web via l'index de liens de cette page Web.

(5) auteur (auteur)

Description : utilisé pour marquer l'auteur de la page Web :

<meta name="author" content="PHP中文网">

( 6) générateur (logiciel de production de page web)

Description : Un exemple de logiciel utilisé pour indiquer la page web : (je ne sais pas si ça peut s'écrire comme ça) :

<meta name="generator" content="Sublime Text3">

(7) copyright )

Explication : Exemple de marquage des informations de copyright :

<meta name="copyright" content="PHP中文网"> //代表该网站为PHP中文网个人版权所有。

(8) revisit-after (robot des moteurs de recherche heure de visite)

Remarque : si la page n'est pas mise à jour fréquemment, afin de réduire la pression sur le serveur causée par les robots des moteurs de recherche, vous pouvez définir une heure de visite des robots. Si le temps de visite est trop court, les robots se rendront à l'heure par défaut définie. Exemple :

<meta name="revisit-after" content="7 days" >

(9) moteur de rendu (méthode de rendu du navigateur double cœur)

Description : le moteur de rendu est préparé pour les navigateurs double cœur et est utilisé pour spécifier la valeur par défaut pour les navigateurs dual-core Comment afficher la page. Par exemple, navigateur 360. Exemple :

<meta name="renderer" content="webkit"> //默认webkit内核
<meta name="renderer" content="ie-comp"> //默认IE兼容模式
<meta name="renderer" content="ie-stand"> //默认IE标准模式

attribut http-equiv

http-equiv, comme son nom l'indique, est équivalent au rôle de HTTP. Le format de syntaxe de l'attribut http-equiv dans la

balise méta est :

<meta http-equiv="参数" content="具体的描述">

L'attribut http-equiv a principalement les paramètres suivants :

(1 ) content- Type (définir le jeu de caractères de la page Web) (il est recommandé d'utiliser la méthode HTML5)

Description : utilisé pour définir le jeu de caractères de la page Web afin de faciliter l'analyse et le rendu de la page par le navigateur.

<meta http-equiv="content-Type" content="text/html;charset=utf-8">  //旧的HTML,不推荐
rrree

(2) (Généralement défini sur le dernier mode, ce paramètre est également très courant dans les principaux frameworks.)

<meta charset="utf-8"> //HTML5设定网页字符集的方式,推荐使用UTF-8

(3) cache-control (spécifiez le mécanisme de mise en cache suivi des requêtes et des réponses)

Description : indiquez au navigateur comment mettre en cache une réponse et combien de temps la mettre en cache

<meta http-equiv="cache-control" content="no-cache">

共有以下几种用法:

no-cache: 先发送请求,与服务器确认该资源是否被更改,如果未被更改,则使用缓存。

no-store: 不允许缓存,每次都要去服务器上,下载完整的响应。(安全措施)

public : 缓存所有响应,但并非必须。因为max-age也可以做到相同效果

private : 只为单个用户缓存,因此不允许任何中继进行缓存。(比如说CDN就不允许缓存private的响应)

maxage : 表示当前请求开始,该响应在多久内能被缓存和重用,而不去服务器重新请求。例如:max-age=60表示响应可以再缓存和重用 60 秒。

禁止百度自动转码

说明:用于禁止当前页面在移动端浏览时,被百度自动转码。虽然百度的本意是好的,但是转码效果很多时候却不尽人意。所以可以在head中加入例子中的那句话,就可以避免百度自动转码了。

<meta http-equiv="Cache-Control" content="no-siteapp" />

(4)expires(网页到期时间)

说明:用于设定网页的到期时间,过期后网页必须到服务器上重新传输。

<meta http-equiv="expires" content="Sunday 26 October 2016 01:00 GMT" />

(5) refresh(自动刷新并指向某页面)

说明:网页将在设定的时间内,自动刷新并调向设定的网址。

<meta http-equiv="refresh" content="2;URL=http://www.php.cn/"> //意思是2秒后跳转到PHP中文网

(6) Set-Cookie(cookie设定)

说明:如果网页过期。那么这个网页存在本地的cookies也会被自动删除。

<meta http-equiv="Set-Cookie" content="name, date"> //格式
<meta http-equiv="Set-Cookie" content="User=Lxxyx; path=/; expires=Sunday, 10-Jan-16 10:00:00 GMT"> //具体范例

content 属性

content 属性提供了名称/值对中的值。该值可以是任何有效的字符串。

content 属性始终要和 name 属性或 http-equiv 属性一起使用。

scheme 属性

scheme 属性用于指定要用来翻译属性值的方案。此方案应该在由 93f0f5c25f18dab9d176bd4f6de5d30e 标签的 profile 属性指定的概况文件中进行了定义。

总结:meta标签的自定义属性实在太多了。所以只总结了一些常用的,希望对大家有所帮助。

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent:Comment mettre en page HTMLArticle suivant:Comment mettre en page HTML