Maison  >  Article  >  interface Web  >  Introduction détaillée au rôle de DOCTYPE et à la différence entre le mode standard et le mode de compatibilité

Introduction détaillée au rôle de DOCTYPE et à la différence entre le mode standard et le mode de compatibilité

高洛峰
高洛峰original
2017-03-20 16:09:202566parcourir

Le rôle du DOCTYPE et la différence entre le mode standards et le mode compatibilité

  1. La déclaration doit être en tête du document HTML , dans HTML5 n'est pas sensible à la casse

  2. la déclaration n'est pas une balise HTML, c'est une balise utilisée pour indiquer au navigateur la version HTML actuelle de la directive

  3. Le moteur de mise en page HTML des navigateurs modernes décide d'utiliser le mode de compatibilité ou le mode standards pour restituer le document en vérifiant le doctype. avoir un Modèle proche du standard.

  4. Dans HTML4.01, la déclaration pointe vers une DTD Puisque HTML4.01 est basé sur SGML, la DTD spécifie des règles de balisage pour garantir. que le navigateur Restitue correctement le contenu

  5. HTML5 n'est pas basé sur SGML, il n'est donc pas nécessaire de spécifier une DTD

La différence entre les standards mode et mode de compatibilité : la composition en mode standard et le mode de fonctionnement JS s'exécutent selon le standard le plus élevé pris en charge par le navigateur. En mode de compatibilité, les pages sont affichées de manière vaguement rétrocompatible, simulant le comportement des anciens navigateurs pour empêcher le site de fonctionner.

Différences spécifiques :
1.Modèle de boîte
En mode strict : largeur est la largeur du contenu, la largeur réelle de l'élément = largeur ;
En mode de compatibilité : la largeur est = largeur de la bordure de remplissage
2. En mode de compatibilité, vous pouvez définir le pourcentage de hauteur ainsi que la hauteur et la largeur des éléments en ligne
En mode Standards, définissez la largeur et height ne prendront pas effet, mais en mode compatibilité, cela prendra effet. En mode standards, la hauteur d'un élément est déterminée par le contenu qu'il contient. Si l'élément parent ne définit pas de hauteur, il n'est pas possible pour l'élément enfant de définir un pourcentage de hauteur.
3. Utiliser margin:0 auto pour définir le centrage horizontal ne fonctionnera pas dans IE
Utiliser margin:0 auto peut centrer l'élément horizontalement en mode standard, mais cela ne fonctionnera pas en mode de compatibilité (en utilisant
texte). -alignattributsolution)body{text-align:center};#content{text-align
:left}4. Les attributs de police ne peuvent pas
hériter des paramètres de la couche supérieure de , espace blanc:pre sera invalide et le remplissage de l'image définie sera invalide

  1. < La déclaration !doctype> doit être en tête du document HTML, avant la balise , pour indiquer à l'analyseur du navigateur quelle norme de document utiliser pour analyser ce document. Un DOCTYPE inexistant ou mal formaté entraînera le rendu du document en mode compatibilité. HTML5 n'est pas sensible à la casse

  2. la déclaration n'est pas une balise HTML, c'est une instruction utilisée pour indiquer au navigateur la version HTML actuelle

  3. Le moteur de mise en page HTML des navigateurs modernes détermine s'il faut utiliser le mode compatibilité ou le mode standards pour restituer le document en vérifiant le doctype. Certains navigateurs ont un modèle proche des standards.

  4. Dans HTML4.01, la déclaration pointe vers une DTD Puisque HTML4.01 est basé sur SGML, la DTD spécifie des règles de balisage pour garantir que le navigateur restitue le contenu. correctement

  5. HTML5 n'est pas basé sur SGML, il n'est donc pas nécessaire de spécifier une DTD

La différence entre le mode standards et le mode de compatibilité : les modes de formatage et de fonctionnement JS du mode standard sont basés sur cela et fonctionnent selon les normes les plus élevées prises en charge par le navigateur. En mode de compatibilité, les pages sont affichées de manière vaguement rétrocompatible, simulant le comportement des anciens navigateurs pour empêcher le site de fonctionner.

Différences spécifiques :
1. Modèle de boîte
En mode strict : la largeur est la largeur du contenu, la largeur réelle de l'élément = largeur ;
En mode compatibilité : la largeur est =largeur de la bordure de remplissage
2. En mode de compatibilité, vous pouvez définir le pourcentage de hauteur ainsi que la hauteur et la largeur des éléments en ligne
En mode Standards, la définition de la largeur et de la hauteur des éléments en ligne tels que la durée ne prendra pas effet, mais en mode de compatibilité, cela le fera. prendre effet.
En mode standards, la hauteur d'un élément est déterminée par le contenu qu'il contient. Si l'élément parent ne définit pas de hauteur, il n'est pas possible pour l'élément enfant de définir un pourcentage de hauteur.
3. Utiliser margin:0 auto pour définir le centrage horizontal ne fonctionnera pas dans IE
Utiliser margin:0 auto peut centrer l'élément horizontalement en mode standard, mais cela ne fonctionnera pas en mode de compatibilité (utilisez l'option text-align attribut) Solution)
body{text-align:center};#content{text-align:left}
4. En mode de compatibilité, les attributs de police du tableau ne peuvent pas hériter des paramètres du calque supérieur, et du blanc. -space:pre ne sera pas valide. La définition du remplissage de l'image sera invalide

.

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