La partie principale du document HTML comprend généralement le titre de page désigné, qui fournit des informations sur la page elle-même, charge la table de style et charge le fichier JavaScript (pour les considérations de performances, la plupart du temps est placé en bas de la page < / Body> Charge avant la fin de l'étiquette met fin à JavaScript). À l'exception du titre, le contenu de la tête n'est pas visible pour les visiteurs de la page.
Ce qui suit est un exemple de la partie de tête du document HTML:
<A-Head> <Meta Charset = UTF-8 /> <Meta Name = Author Content = Adam Freeman /> <Title> Titre de votre page </ Title> <Base Href = http: // Tittings / Target = _ Blank /> < Type de style = Texte / CSS> A {Color de fond: Gray;Élément titre
L'élément de tête doit contenir un élément de titre, qui apparaîtra dans l'onglet du navigateur ou en haut de la fenêtre du navigateur, comme titre de la page Web et lié au navigateur.
élément de baseL'élément de base est utilisé pour définir une URL de référence pour analyser les liens relatifs du document HTML sur cette base. S'il n'est pas spécifié, utilisez l'URL du document de chargement actuel. L'élément de base peut également définir le chemin pour ouvrir le lien lorsque l'utilisateur clique et comment le navigateur réagit lors de la soumission du formulaire.
<base href = http: // bjpowernode / listings / cible = _blank />
1) HREF est l'URL de référence spécifiée.
2) Où ouvrir tous les liens de la page, y compris où l'attribut cible est ouvert, y compris la valeur:
1) _BLANK: Ouvrez le document connecté dans la nouvelle fenêtre;
2) _self: Par défaut, ouvrez le document de lien dans le même framework;
3) _parent: ouvrez le document lié dans le cadre parent;
4) _top: ouvrez le document de lien dans toute la fenêtre;
5) FrameName: ouvrez le document de lien dans le cadre spécifié.
Méta-élémentLes éléments de méta sont utilisés pour définir diverses métadonnées de la documentation. Élément de tête.
Spécifiez la paire de métadonnées de nom / valeur<meta name = auteur contenu = Adam Freeman />
L'attribut de nom est utilisé pour représenter le type de métadonnées, qui fournit la valeur de l'attribut de contenu. L'attribut de nom contient les valeurs suivantes:
1) Nom de l'application: le nom du système d'application Web qui appartient à la page actuelle;
2) Auteur: Le nom de l'auteur de la page actuelle;
3) Description: Instructions de la page actuelle;
4) Générateur: le nom du logiciel utilisé pour générer HTML;
5) Mots-clés: Décrivez le contenu de la page.
En plus des cinq noms de métadonnées pré-définis pré-définis, vous pouvez également utiliser l'expansion des métadonnées. Certaines extensions sont plus utilisées, telles que les métadonnées des robots.
<meta name = Robots Content = NOINDEX />
Cet attribut a des valeurs que la plupart des moteurs de recherche sont reconnus:
1) NONDEX: N'indexez pas cette page;
2) No Archive: n'archisez pas et ne cachez pas cette page;
3) Nofollow: ne continuez pas à rechercher le lien sur cette page.
La plupart des moteurs de recherche fournissent des lignes directrices pour l'optimisation des pages Web ou des sites Web entiers, et vous pouvez afficher des pages Web ou des directives d'optimisation des sites Web fournies par le moteur de recherche correspondant.
Code de caractère de déclaration<Meta Charset = UTF-8 />
Le codage de caractères du document de déclaration de méta-élément dans l'élément de tête est UTF-8 (par défaut).
Champ d'en-tête HTTP SIMULATIONLes éléments de méta peuvent être utilisés pour simuler ou remplacer la valeur de trois champs d'en-tête HTTP.
<Meta Http-Equiv = Refresh Content = 5 />
L'utilisation de l'attribut HTTP-Equiv est le nom du nom de champ d'en-tête qui spécifie l'en-tête simulé, et la valeur de champ est spécifiée dans la propriété de contenu. La valeur facultative de la propriété HTTP-Equiv est la suivante:
1) Rafraîchissement: spécifiez un intervalle de temps en secondes en secondes. Vous pouvez également spécifier une URL séparément pour que le navigateur puisse charger, tel que:
<meta http-equiv = REFRESSH Content = 5;
2) Style par défaut: spécifiez la table de style préférée par la page.
3) Type de contenu: une autre méthode pour déclarer le codage des caractères utilisé dans la page HTML, tels que ::
<meta http-equiv = contenu contenu de type = text / html charset = utf-8 />Élément de style
Définissez le style CSS intégré dans le document HTML.
<Type de style = Text / CSS> A {fond de fond: Gray;
Un nouveau style est conçu pour l'élément A. Les éléments de style peuvent apparaître dans diverses parties des documents HTML.
Médias qui peuvent spécifier le style pour les éléments de style:
<Style Media = Screen and (min-width: 500px) type = text / css> ...... </ style>
L'écran de l'attribut multimédia est un type d'appareil, et la plage de valeur facultative comprend:
1) Tous: utilisez le style pour tous les appareils (valeurs par défaut);
2) Aural: Utilisez le style pour le synthétiseur vocal;
3) Braille: utilisez le style pour demander à l'appareil;
4) Manche: utilisez le style pour le dispositif de poche;
5) Projet: Utilisez des styles pour les projecteurs;
6) Imprimer: lors de l'utilisation de la page de prévisualisation et d'impression du style pour imprimer;
7) Écran: utilisez le style pour l'écran d'affichage de l'ordinateur;
8) TTY: Utilisez le style pour des équipements de largeur égale tels que les machines à passage électrique;
9) TV: Utilisez le style pour la télévision.
(Min-largeur: 500px) Caractéristiques spécifiées dans l'attribution des médias, y compris:
1) Largeur Hauteur: spécifiez la largeur et la hauteur de la fenêtre du navigateur, unité PX, par exemple: largeur: 200px
2) Appareil-largeur-HEURT: Spécifiez la largeur et la hauteur de l'ensemble de l'appareil (pas seulement la fenêtre du navigateur), unité PX, par exemple: Min-Device-Height: 200px
3) Résolution: la densité de pixels de l'appareil, l'unité DPI (point / pouce) ou DPCM (point / cm), par exemple: MAX-RÉSOLUTION: 600DPI
4) Orientation: la direction à long terme du dispositif spécifié, la valeur facultative est le portrait et le paysage
5) Aspect -Ratio Device-Aspect-Ratio: Spécifiez le rapport de largeur de pixel de la fenêtre du navigateur ou de l'appareil entier, par exemple: Min-Aspect-Ratio: 16/9
6) Couleur monochrome: spécifiez les chiffres binaires occupés par chaque pixel sur chaque pixel sur le dispositif couleur ou noir et blanc, par exemple: min-monochrome: 2
7) Index de couleur: le nombre de couleurs qui peuvent être affichées par le dispositif désigné, par exemple: Max-Color-Idex: 256
8) SCAN: Spécifiez le mode TV de balayage, y compris la valeur progressive et l'interlation
9) Grille: type de périphérique spécifié, la valeur de support est de 0 et 1 (1 représente un périphérique de type grille, en utilisant un contenu d'affichage de grille fixe)
Élément de liaisonIl est utilisé pour établir une connexion entre les documents HTML et les ressources externes (telles que les tables de style CSS). L'élément de liaison contient 6 attributs locaux, comme suit:
1) HREF: spécifiez l'URL de la ressource pointée vers l'élément de liaison;
2) Hreflang: Expliquez la langue utilisée dans les ressources associées;
3) Média: expliquez quel périphérique est utilisé dans le contenu connexe et les attributs multimédias dans le style;
4) Rel: La plage de la relation entre le document et les ressources associées est la suivante:
--- Alternate: la version alternative du lien vers le document, comme la traduction d'une autre langue;
--- Auteur: auteur du lien vers le document;
--- Aide: le document description connecté au document actuel;
--- Icône: spécifiez les ressources d'icône;
--- Licence: lien vers la licence pertinente au document actuel;
--- Pingback: spécifiez un serveur de pingback, qui peut être automatiquement notifié lors du lien des autres sites Web à des blogs;
--- Préfet: obtenez une ressource à l'avance;
--- Stylesheet: Chargez la table de style externe.
5) Tailles: spécifiez la taille de l'icône;
6) Type: Spécifiez le type MIME des ressources associées, telles que le texte / CSS, l'image / X-ICON.
Chargez la table de style externe<link rel = Stylesheet type = text / css href = styles.css />
Vous pouvez utiliser plusieurs éléments de liaison pour charger plusieurs ressources externes.
Définissez le logo du site Web pour la page<link rel = raccourci icône href = favicon.ico type = image / x-icon />
Lorsque le navigateur est chargé de la page HTML, il chargera et affichera le logo du site Web.
Remarque: Si le fichier de logo du site Web est situé dans /favicon.ico (le répertoire racine du serveur Web), il n'est pas nécessaire d'utiliser l'élément de liaison. Aucun élément de liaison.
Ressource pré-observée
Le navigateur peut être tenu d'obtenir les ressources qui devraient être utilisées bientôt.
<link rel = prefetch href = / page2.html />
Remarque: Tous les navigateurs ne prennent pas actuellement en charge cette fonction.
Élément de scriptUtilisé pour ajouter des scripts sur la page, vous pouvez définir directement le script et référencer le script dans le document. Les attributs locaux pris en charge par cet élément sont les suivants:
1) Type: Le type du script référencé ou défini, pour l'attribut du script JavaScript, peut omettre
2) SRC: spécifiez l'URL du fichier de script externe
3) Déférer Async (HTML5 Nouveau ajout): Définissez la méthode d'exécution du script, ces deux attributs ne peuvent être utilisés qu'avec les attributs SRC
4) Charset: Expliquez le codage des caractères utilisé dans le fichier de script externe, qui ne peut être utilisé qu'avec l'attribut SRC
Définissez le document dans le script intégré<Script> Document.Write (c'est du script);
Par défaut, le navigateur sera exécuté dès que le script rencontre la page.
Chargez la bibliothèque de script externeVous pouvez mettre le script dans un fichier séparé, puis charger le document HTML avec des éléments de script.
<script src = simple.js> </ script>Épuiser l'exécution du script
Utilisez des attributs asynchronisés et différés pour contrôler la méthode d'exécution du script.
<Script Defer Src = Simple2.js> </ Script>
Parce que HTML sera exécuté lorsqu'il rencontrera un script, si votre script doit utiliser le contenu dans le script HTML, vous devez généralement mettre le script dans le script HTML correspondant, mais dans HTML5, le même objectif peut être atteint avec le report propriété.
Lorsque le navigateur rencontre des éléments de script, le comportement par défaut consiste à suspendre la page de traitement lors du chargement et de l'exécution du script, et chaque élément de script est exécuté à son tour. Les attributs asynchronisés peuvent être des scripts de chargement et d'exécution asynchrones pendant le document HTML d'analyse du navigateur.
<script async src = Simple2.js> </ script>élément noscrip
L'élément NOScript est utilisé pour afficher un contenu pour les utilisateurs qui désactivent JavaScript ou les navigateurs ne prennent pas en charge JavaScript.
<noscript> <h1> javascript est requis!
Un autre choix est de le conduire à une autre URL lorsque le navigateur ne prend pas en charge JavaScript.
<noscript> <meta http-equiv = Refresh Content = 0;