Le contenu de cet article concerne quels attributs se trouvent dans la balise head ? Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il vous sera utile.
Qu'y a-t-il dans la balise head ?
Dans chaque document HTML, il existe une balise indispensable :
. En tant que conteneur, elle contient principalement des balises utilisées pour décrire les informations (métadonnées) du document HTML lui-même. ne sera pas affiché sur la page. Dans la plupart des cas, il sera vu par les navigateurs et les moteurs de recherche.
Les balises pouvant être utilisées dans
sont :
, <script> ; noscript> </p>
<p style="white-space: normal;">Introduction aux balises méta-informations</p>
<p style="white-space: normal;"><title></p>
<p>Définir le titre du document, qui est affiché sur la barre de titre ou la page à onglet du navigateur et résume généralement le page Web entière entièrement contenue. </p>
<p style="white-space: normal;"><base></p>
<p>Fournit une base pour toutes les URL relatives sur la page. Il ne peut y avoir qu'une seule balise <base> </p>
<p>Actuellement, je n'ai observé "Taobao" qu'en utilisant cette balise. </p>
<p style="white-space: normal;"><link></p>
<p>Spécifie la relation entre les ressources externes et le document actuel, souvent dans une feuille de style de lien, comme indiqué ci-dessous : </p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><link rel="stylesheet" href="xxx.css" type="text/css"></pre><div class="contentsignin">Copier après la connexion</div></div>
<p>Bien sûr, il y a il y en a bien d'autres Fonction : </p>
<ol><li>Par exemple, il est utilisé pour le référencement, principalement pour les moteurs de recherche : </li></ol>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><link rel="canonical" href="..."></pre><div class="contentsignin">Copier après la connexion</div></div>
<p>Dans les sites Web, il y a souvent plusieurs URL pointant vers la même page, comme mentionné ci-dessus. La balise indique au moteur de recherche quelle est l'URL principale de la page, afin que le moteur de recherche puisse conserver la page principale et supprimer les autres pages en double. </p>
<ol><li>Fournir un abonnement rss : </li></ol>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><link rel="alternate" type="application/rss+xml" title="RSS" href="..."></pre><div class="contentsignin">Copier après la connexion</div></div>
<p>En plus d'être compréhensibles par les moteurs de recherche, les balises ci-dessus peuvent également être reconnues par de nombreux plug-ins de navigateur. </p>
<ol><li> représente l'icône de la page : </li></ol>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><link rel="icon" href="https://xxx.png"></pre><div class="contentsignin">Copier après la connexion</div></div>
<p>La plupart des navigateurs liront la ressource de ce lien et l'afficheront sur la page. </p>
<ol><li>Fournit un prétraitement des pages : </li></ol>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><link rel="dns-prefetch" href="//xxx.com"></pre><div class="contentsignin">Copier après la connexion</div></div>
<p>Faites une requête DNS pour un nom de domaine à l'avance. Forcer la prélecture des noms de domaine peut être utile dans certains cas. </p>
<p>Par exemple, sur la page d'accueil du site Web, forcez la pré-résolution des noms de domaine fréquemment référencés sur l'ensemble du site Web, même s'ils ne sont pas utilisés sur la page d'accueil elle-même. Bien que les performances de la page d’accueil ne soient pas affectées, cela améliorera les performances globales du site. </p>
<p><style></p>
<p> Contient les informations de style du document. </p>
<p><meta></p>
<p>Une balise générale de représentation des informations de métadonnées, apparaissant généralement sous forme de paires clé-valeur, telles que : <meta name="xxx" content="yyy"> 🎜></p>attribut charset <p></p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><meta charset="UTF-8"></pre><div class="contentsignin">Copier après la connexion</div></div> À partir de HTML5, il est recommandé d'utiliser la méthode d'écriture ci-dessus pour déclarer le codage de caractères utilisé dans le document actuel. Il est recommandé de le mettre en premier dans <head>. ; <p></p>Attribut http-equiv<p style="white-space: normal;"></p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><meta http-equiv="content-type" content="text/html; charset=UTF-8">En HTML4, le code ci-dessus était utilisé pour déclarer le jeu de caractères, mais il est désormais obsolète. <p></p>En plus du type de contenu, il existe plusieurs autres valeurs : <p></p>content-langue (obsolète), set-cookie (obsolète), default-style, rafraîchissement, content-security-policy <p></p> n'est pas couramment utilisé, je ne le présenterai donc pas un par un. Il est également assez facile à comprendre. Si vous êtes intéressé, vous pouvez cliquer ici pour en savoir plus. <p></p>attribut name <p style="white-space: normal;"></p>En fait, la balise <meta> peut être définie librement, à condition que les parties en lecture et en écriture soient d'accord sur le format du nom et du contenu. Regardons un exemple : <p></p>
<pre class="brush:php;toolbar:false"><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"></pre><div class="contentsignin">Copier après la connexion</div></div>L'utilisation ci-dessus ne figure pas dans le standard HTML, mais c'est le standard de facto pour le développement mobile. Voici une explication du contenu dans content : <p></p>width : largeur de la page, qui peut être un entier positif ; il peut également s'agir d'une chaîne "device-width", ce qui signifie qu'elle est égale à la largeur de l'appareil. height : hauteur de la page, qui peut être un entier positif ; il peut également s'agir d'une chaîne "device-height", ce qui signifie qu'elle est égale à la hauteur de l'appareil. échelle initiale : mise à l’échelle initiale. échelle minimale : rapport de mise à l'échelle minimum. échelle maximale : rapport de mise à l'échelle maximal. user-scalable : s'il faut autoriser la mise à l'échelle de l'utilisateur. En plus de la fenêtre d'affichage, la valeur de l'attribut <p></p>name a également plusieurs valeurs : <p></p>nom de l'application, auteur, description, générateur, mots-clés, référent, robots, etc. <p></p>De même, je ne les présenterai pas un par un. Si vous êtes intéressé, vous pouvez cliquer ici pour en savoir plus. <p></p><script><p></p> est utilisé pour intégrer ou référencer un script exécutable. Jetons un coup d'œil à quelques attributs globaux courants des balises de script : <p></p>async<p></p> amène le navigateur à utiliser un autre thread pour télécharger le script, ce qui ne bloquera pas le rendu de la page. Lorsque le script est téléchargé, le navigateur suspend le rendu, exécute le script et continue à afficher la page après l'exécution. <p></p>async ne peut pas garantir l'ordre d'exécution des scripts, quel que soit le script téléchargé en premier, il sera exécuté en premier. <p></p>différer<p></p>
<p>Le navigateur téléchargera également le script en parallèle, mais il ne sera pas exécuté immédiatement une fois le téléchargement terminé. Au lieu de cela, il attendra que le DOM soit chargé (c'est-à-dire la balise </html>). vient d'être lu) avant d'exécuter le script. </p>
<p>defer garantit que les scripts sont exécutés dans l'ordre dans lequel ils apparaissent sur la page. </p>
<p>src</p>
<p> définit l'adresse qui fait référence à un script externe. Il ne doit y avoir aucun script intégré dans la balise script spécifiant cet attribut. Si le fichier de script utilise des caractères non anglais, le codage des caractères doit également être noté. Tels que : </p>
<p><script charset="utf-8" src="https://www.example.com/script.js"></script>
type La valeur par défaut est text/javascript
Si vous souhaitez en savoir plus sur la balise
Tutoriels populaires
Plus>
Recommandations populaires
Derniers téléchargements
Plus>