Maison  >  Article  >  interface Web  >  Que comprend généralement le contenu de l'en-tête HTML5 ?

Que comprend généralement le contenu de l'en-tête HTML5 ?

青灯夜游
青灯夜游original
2021-12-17 17:17:396178parcourir

Le contenu de l'en-tête HTML5 comprend généralement : 1. Titre de la page Web défini par la balise de titre ; 2. Favicon (petite icône du site Web) ; 4. Description du site Web ; 6. Auteur de la page ; (adaptation du terminal mobile) ; 8. Feuille de style CSS ; 9. Script JavaScript.

Que comprend généralement le contenu de l'en-tête HTML5 ?

L'environnement d'exploitation de ce tutoriel : système Windows 7, version HTML5, ordinateur Dell G3.

Selon nos besoins, nous pouvons définir une grande quantité de métadonnées dans l'en-tête HTML, ou nous pouvons définir peu ou pas de métadonnées du tout. Bien que la balise head fasse partie du document HTML, son contenu n'est pas affiché dans le navigateur.

contenu de l'en-tête HTML5

1. Titre de la page Web - balise La balise <title> ; la balise peut Il est considéré comme un document HTML valide. De plus, une seule balise <title> est autorisée dans un document HTML et la balise <title>

Notez que seul le contenu en texte brut est autorisé à l'intérieur de la balise , et qu'aucune autre balise HTML n'est autorisée. <p></p>Exemple : <p></p><pre class="brush:html;toolbar:false"><head> <title>PHP中文网</title> </head></pre><p><br></p> <p><img src="https://img.php.cn/upload/image/665/168/925/1639731780475326.png" title="1639731780475326.png" alt="Que comprend généralement le contenu de len-tête HTML5 ?">2. Favicon</p> <p><strong>La petite icône sur le côté gauche du titre de la page Web spécifie son chemin. S'il n'est pas spécifié, le navigateur recherchera </strong><pre class="brush:html;toolbar:false"><link rel="icon" href="/favicon.ico" type="image/x-icon" /></pre></p> <p>3 à la racine. répertoire. Méthode d'encodage </p> <p><strong>La spécification de la méthode d'encodage est placée au début de l'en-tête. Si elle n'est pas spécifiée, le navigateur la déterminera également en fonction de l'en-tête du serveur, mais elle peut ne pas être exacte. La balise </strong><pre class="brush:html;toolbar:false"><head> <meta charset="UTF-8"> </head></pre></p> <p><meta> est utilisée pour fournir des métadonnées sur le document HTML, telles que la période de validité de la page, l'auteur de la page, la liste de mots clés, la description de la page, etc. Les données définies par la balise <meta> ne seront pas affichées sur la page, mais seront analysées par le navigateur. L'attribut </p> <blockquote><p>charset est utilisé pour spécifier l'encodage des caractères du document HTML. Dans l'exemple ci-dessus, nous définissons l'encodage des caractères du document sur "UTF-8". </p></blockquote> <p>4. Description du site Web</p> <p><pre class="brush:html;toolbar:false"><meta name="description" content="这里是对网站的描述"></pre><strong> Définir les informations de description de la page est bénéfique pour les moteurs de recherche. </strong></p> <p>5, </p>Page<p><strong>Mots-clés<span style="background-color: rgb(255, 255, 255); color: rgb(68, 68, 68); font-family: " helvetica neue yahei arial sans-serif></span><span style="background-color: rgb(255, 255, 255); color: rgb(68, 68, 68); font-family: " helvetica neue yahei arial sans-serif><pre class="brush:html;toolbar:false"><meta name="keywords" content="HTML, HTML教程, HTML入门"></pre></span>Les mots-clés sont utilisés pour fournir aux moteurs de recherche des informations sur la page. </strong></p> <p></p>6, <p><strong>Auteur de la page<span style="background-color: rgb(255, 255, 255); color: rgb(68, 68, 68); font-family: " helvetica neue yahei arial sans-serif></span><span style="background-color: rgb(255, 255, 255); color: rgb(68, 68, 68); font-family: " helvetica neue yahei arial sans-serif><pre class="brush:php;toolbar:false"><meta name="author" content="作者名"></pre></span>Les informations sur l'auteur peuvent être automatiquement extraites via certains systèmes de gestion de contenu. </strong></p> <p></p>7. <p>Viewport (Adaptation mobile) <strong><span style="background-color: rgb(255, 255, 255); color: rgb(68, 68, 68); font-family: " helvetica neue yahei arial sans-serif></span>Ceci est très courant et est généralement utilisé pour l'adaptation mobile. La page est placée dans une fenêtre virtuelle - viewport. Si la page Web n'utilise pas de viewport, cela apparaîtra. lorsque nous ouvrons le navigateur mobile, il est très petit, et il peut également être déplacé et zoomé. Il est très faible. Viewport permet aux développeurs Web de définir dynamiquement la taille des éléments de contrôle dans leur contenu Web, de manière à ce qu'ils le soient. navigateur Le même effet que dans la page Web (réduction d'échelle) est obtenu. , utilisé pour mieux prendre en charge les sites Web réactifs. </strong><pre class="brush:html;toolbar:false"> <meta name="viewport" content="width=device-width, initial-scale=1"></pre></p> <p></p>width : contrôlez la taille de la fenêtre d'affichage. Généralement, elle est spécifiée en largeur de l'appareil (l'unité est constituée de pixels CSS mis à l'échelle à 100 %). height: et width En conséquence, spécifiez la hauteur. <ul style="list-style-type: disc;"> <li> <p></p>initial-scal : rapport de mise à l'échelle initiale, le rapport de mise à l'échelle lorsque la page est chargée pour la première fois. </li> <li> <p></p>échelle maximale : le rapport maximum sur lequel l'utilisateur est autorisé à zoomer. </li> <li> <p></p>échelle minimale : le rapport minimum sur lequel l'utilisateur est autorisé à zoomer. </li> <li> <p></p>user-scalable : indique si l'utilisateur peut zoomer manuellement. </li> <li><p></p></li> <li>8. Style CSS intégré--balise <style><p>使用 <style> 标签可以在 HTML 文档中嵌入 CSS 样式,需要注意的是在 <style> 标签中定义的样式仅对当前 HTML 文档有效。示例代码如下:<pre class="brush:html;toolbar:false"><head> <title>此处书写标题</title> <style> body { background-color: YellowGreen; } h1 { color: red; } p { color: green; } </style> </head></pre><blockquote><p>注意:对于文档中的唯一样式可以使用 <style> 标签,但对于在多个文档中通用的样式,使用外部样式表更为合适。<p><strong><span style="background-color: rgb(255, 255, 255); color: rgb(68, 68, 68); font-family: "Helvetica Neue", 微软雅黑, "Microsoft Yahei", Helvetica, Arial, sans-serif;">9、外部css样式表--<link> 标签<p><link> 标签经常用于引用外部 CSS 样式表,<link> 标签中包含两个主要的属性,分别是 rel 和 href。rel 属性用来指示引用文件的类型,href 属性用来设置外部文件的路径。示例代码如下:<pre class="brush:html;toolbar:false"><head> <title>此处书写标题</title> <link rel="stylesheet" href="common.css"> </head></pre><blockquote><p>HTML <head> 标签中可以包含任意数量的 <link> 标签。<p><strong><span style="background-color: rgb(255, 255, 255); color: rgb(68, 68, 68); font-family: "Helvetica Neue", 微软雅黑, "Microsoft Yahei", Helvetica, Arial, sans-serif;">10、JavaScript 脚本<br/><p><span style="background-color: rgb(255, 255, 255); color: rgb(68, 68, 68); font-family: "Helvetica Neue", 微软雅黑, "Microsoft Yahei", Helvetica, Arial, sans-serif;">通过script标签嵌入JavaScript 脚本代码或链入脚本文件<pre class="brush:js;toolbar:false"><head> <script> document.write("PHP中文网") </script> </head></pre><pre class="brush:js;toolbar:false"><head> <script src="js/test.js"></script> </head></pre><p>相关推荐:《<a href="http://www.php.cn/course/list/11.html" target="_blank" textvalue="html视频教程">html视频教程》</style> </li> </ul>

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