doctype の役割と標準モードおよび互換モードの違い

DOCTYPE の役割と標準モードと互換モードの違い

1. 宣言は HTML ドキュメントの先頭、 にある必要があります。使用するパーサー このドキュメントをどのドキュメント標準で解析するか。 DOCTYPE が存在しないか、形式が正しくない場合、ドキュメントは互換モードで表示されます

   。 HTML5 は大文字と小文字を区別しません margin:0 auto を使用すると、標準モードでは要素を水平方向に中央揃えにできますが、互換モードでは無効になります (解決するには text-align 属性を使用します)。 body {text-align:center};#content{text-align:left}4. 互換モードでは、Table のフォント属性は上位レイヤーの設定を継承できず、white-space:pre は無効になり、画像のパディングは無効になります

   宣言は、HTML ドキュメントの先頭、 タグの前になければなりません。

   は、このドキュメントを解析するために使用するドキュメント標準をブラウザのパーサーに指示します。 。 DOCTYPE が存在しないか、形式が正しくない場合、ドキュメントは互換モードで表示されます
   。 HTML5 は大文字と小文字を区別しません
   
   
   
   宣言は HTML タグではなく、ブラウザに現在の HTMl バージョンを伝えるために使用される命令です
   
   
   
   最新のブラウザの HTML レイアウト エンジンが互換性の使用を決定しますdoctype を確認することにより、ドキュメントは標準モードでレンダリングされ、一部のブラウザーは標準に近いモデルを備えています。
   

   1. HTML4.01 では、 は DTD を指します。HTML4.01 は SGML に基づいているため、DTD はブラウザーがコンテンツを正しく表示するためのマークアップ ルールを指定します
      HTML5 はSGML に基づいていないため、使用されません DTD を指定します
   3. 標準モードと互換モードの違い

      : 標準モード

      の書式設定と JS 操作モードは、すべてブラウザーがサポートする最高の標準で実行されます。
   互換モード
   4. では、サイトが機能しなくなるのを防ぐために、古いブラウザーの動作をシミュレートして、緩やかな下位互換性のある方法でページが表示されます。
      具体的な違い:
   1. ボックスモデル
   5. 厳密モードでは: width はコンテンツの幅であり、要素の実際の幅 = width です。

      互換モードでは: width は =width+padding+border です

      2.高さのパーセンテージとインライン要素の高さと幅を設定できます
   標準モードでは、span などのインライン要素の幅と高さの設定は有効になりませんが、互換モードでは有効になります。
   標準モードでは、要素の高さはそれに含まれるコンテンツによって決まります。親要素が高さを設定していない場合、子要素の高さのパーセンテージを設定することは無効です。

   3. margin:0 auto を使用して水平方向の中央揃えを設定すると、IE では無効になります margin:0 auto を使用すると、標準モードでは要素を水平方向に中央揃えにできますが、互換モードでは無効になります (これを解決するには text-align 属性を使用します) ) body {text-align:center};#content{text-align:left}4. 互換モードでは、Table のフォント属性は上位レイヤーの設定を継承できず、white-space:pre は無効になります。画像のパディングは無効になります

   以上がdoctype の役割と標準モードおよび互換モードの違いの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。