Maison > Article > interface Web > Analyse détaillée de l'utilisation et des attributs des balises méta HTML
Le contenu de cet article est une analyse détaillée de l'utilisation et des attributs des balises méta html. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. .
Depuis que j'ai appris le front-end par moi-même, je n'ai pas eu beaucoup de contact avec les balises méta, je me concentre principalement sur les balises qui peuvent être affichées, comme span, bouton, h1, etc. Parfois, je vérifie le code source de certains sites Web bien connus et trouve beaucoup de méta dans la balise head.
Aujourd’hui, apprenons à utiliser la méta et voyons quels sont ses attributs.
1. Définition et fonction
les méta, c'est-à-dire les métadonnées (métadonnées) sont les informations sur les données.
Cette balise fournit des métadonnées pour le document HTML. Les métadonnées ne seront pas affichées sur le client, mais seront analysées par le navigateur.
est généralement utilisé pour spécifier la description, les mots-clés, l'heure de la dernière modification du fichier, l'auteur et d'autres métadonnées de la page Web.
Les métadonnées peuvent être appelées à l'aide de navigateurs (comment le contenu est affiché ou les pages sont rechargées), de moteurs de recherche (mots-clés) ou d'autres services Web.
2. Attributs
charset(htm5新增) | 定义文档的字符编码 |
content | 定义与 http-equiv 或 name 属性相关的元信息。 |
http-equiv | http响应头 |
name | 属性名称 |
scheme (htm5废弃) | 翻译 content 属性的值的方案 |
1. charset
Nouvel attribut HTML5 qui définit les caractères de la page actuelle. Codage
Nouvelle méthode d'écriture :
<meta charset="UTF-8">
Ancienne méthode d'écriture :
a71ddd814d1e6bfc91cd420de31796d5
En HTML5, la nouvelle méthode d'écriture est privilégiée
2. attribut de nom
a. mots-clés, mots-clés de la page Web actuelle, qui facilite l'identification des moteurs de recherche et améliore la précision de la recherche
<meta name="keywords" content="cdn,网络加速,运营商">
b. de la page Web actuelle, si elle est utilisée Lors d'une recherche sur Baidu, le contenu de la description sera affiché sous chaque titre des résultats de recherche pour permettre aux utilisateurs de localiser rapidement
<meta name="description" content="本公司专注提供CDN网络加速,同时也提供云计算服务">
c. compliqué et est principalement utilisé dans les pages Web mobiles et doit être écrit séparément. Un article, je vais temporairement sauter
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
d, les robots, la méthode d'indexation des robots des moteurs de recherche
<meta name="robots" content="none">
Les valeurs du contenu sont all, none, index, noindex, follow , nofollow, la valeur par défaut est all, les instructions spécifiques sont telles qu'indiquées dans le tableau :
all | 文档可以被索引,文档中的链接可以被查询 |
none | 文档不能被索引,同时文档中的链接不能被查询 |
index | 文档可以被索引 |
noindex | 文档不能被索引,但是文档中的链接可以被查询 |
follow | 文档中的链接可以被查询 |
nofollow | 文档可以被索引,但是文档中的链接不能被查询 |
e, auteur, le auteur du document
<meta name="author" content="liuhw,liuhuansir@126.com">
f, copyright, la description du copyright du document
<meta name="copyright" content="liuhw">
g, revisit-after, l'intervalle de temps pendant lequel les robots des moteurs de recherche doivent revisiter si votre. le site Web n'est pas mis à jour fréquemment, vous pouvez définir ce temps légèrement plus long, ce qui peut réduire légèrement la pression sur le serveur et économiser de l'argent sur les ressources de bande passante
<meta name="revisit-after" content="5 days" >
h, renderer, la méthode de rendu des navigateurs dual-core. , précisez quel noyau de navigateur est utilisé pour le rendu par défaut, par exemple, navigateur 360 :
<meta name="renderer" content="webkit"> //默认webkit内核 <meta name="renderer" content="ie-comp"> //默认IE兼容模式 <meta name="renderer" content="ie-stand"> //默认IE标准模式
3 , http-equiv
Simulez l'en-tête en http et renvoyer des informations au serveur
a expire, le délai d'expiration de la page Web Après l'expiration, vous devez revisiter le serveur
<meta http-equiv="expires" content="Sunday 26 October 2018 01:00 GMT" />
b, pragma (compatible avec http1. .0, 1.1), cache-control (nouveau dans http1.1), définissez la méthode de cache. Il est recommandé d'utiliser cache-control Pour le contenu de cet attribut, veuillez vous référer au cache dans http -control
<meta http-equiv="cache-control" content="no-cache">c, actualiser, actualiser automatiquement et accéder à l'url déclarée dans le contenu
<meta http-equiv="refresh" content="5;URL=http://www.liuhw.club/"> //5秒后跳转向我自己的域名d, set-cookie, ajouter un cookie
<meta http-equiv="set-cookie" content="TOKEN_KEY=81BBF72619795017B6AC214AE705F1F8; Domain=10.1.100.111; Path=/">e, contenu -Tapez, l'encodage des caractères du document, le même que charset, il est recommandé d'utiliser charset
<meta http-equiv="content-type" content="text/html;charset=gb2312">f, compatible x-ua, indiquez au navigateur quelle version utiliser pour restituer le document
<meta http-equiv="x-ua-compatible" content="IE=edge,chrome=1"/> //指定IE和Chrome使用最新版本渲染当前页面Pour résumer, ce qui précède ne répertorie que certains attributs couramment utilisés. Pour ceux qui ne sont pas répertoriés, veuillez consulter la documentation lorsque vous devez les utiliser [Recommandations associées :
Tutoriel vidéo HTML5]
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!