目次
1. 概要
2. 定義
3.W3C 仕様
4. 仕様と DTD
5.DOCTYPE 要素の構文
6. ツールの確認
7.DOCTYPE 切り替え
1. URL または相対 URL がありません
2. 間違った形式の doctype
3. 移行ドキュメントタイプ
4.不明なドキュメントタイプ
8. XHTML の使用上のヒント
9. おすすめの XHTML 関連書籍
ホームページ ウェブフロントエンド htmlチュートリアル DOCTYPE要素の詳細解説完全版_HTML/Xhtml_Webページ制作

DOCTYPE要素の詳細解説完全版_HTML/Xhtml_Webページ制作

May 16, 2016 pm 04:41 PM
doctype

1. 概要

この記事ではDOCTYPE要素を体系的に解説するとともに、インターネット上の情報が比較的ごちゃごちゃしているため、DOCTYPEの定義などを整理して再定義しました。要素は主に基礎知識と高度な知識に分かれています。基礎知識では、多くの高度な知識がインターネットから得られます。

2. 定義

DOCTYPE は、Document Type の略語です。 要素は、ドキュメントの先頭に配置されます。 ; タグ。ページの DTD を確認することで、そのページがどの W3C 仕様 (HTML または XHTML 仕様など) を使用しているかを判断することもできます。

3.W3C 仕様

多くの設計者にとって、W3C 仕様の正しい翻訳は W3C 勧告であるはずですが、多くの人は現在の W3C 仕様の HTML 仕様と XHTML 仕様を部分的にしか理解していません。 HTML と XHTML の関係については後で説明します。

W3C HTML 仕様とタイムライン

テーブル> W3C XHTML 仕様とタイムライン

规范

推荐

HTML 3.2

1997年1月14日

HTML 4.0

1998年5月24日

HTML 4.01

1999年12月24日

仕様

推奨

HTML 3.2 1997 年 1 月 14 日
HTML 4.0 1998 年 5 月 24 日
HTML 4.01 1999 年 12 月 24 日

仕様

草案/提案書

おすすめ

XHTML 1.0

2000 年 1 月 26 日

XHTML 1.0 リビジョン

2002 年 8 月 1 日

XHTML 1.1

2001 年 5 月 31 日

XHTML モジュール

2001 年 4 月 10 日

XHTML モジュール 1.1

2006 年 7 月 5 日

XHTML 基本

2000 年 12 月 19 日

XHTML 基本 1.1

2006 年 7 月 5 日

XHTML イベント

2003 年 10 月 14 日

XHTML イベント 2

2007 年 2 月 16 日

XHTML 印刷

2006 年 9 月 20 日

XHTML メディア タイプ

2002 年 8 月 1 日

XForms 1.0

2003 年 10 月 14 日

XForms 1.0 (SE)

2006 年 3 月 14 日

XForms 1.1

2007 年 2 月 22 日

XHTML 2.0

2006 年 7 月 26 日

XLink

2001 年 6 月 27 日

HLink

2002 年 9 月 13 日

​​

XHTML は最新の HTML 仕様とも言え、HTML 4.01 からスムーズに移行できる XML アプリケーションです。 HTML 4.01 を XML にリファクタリングする W3C の最初のステップにより、XHTML 1.0 が誕生しました。 XHTML 1.0 は、HTML 4.01 タグによって提供されるセマンティクスに依存しています。

4. 仕様と DTD

ページ ファイルは、 要素を通じてさまざまな DTD を宣言し、現在のページがどの HTML または XHTML 仕様に準拠しているかをブラウザーに伝えます。ここでは、HTML4.01 および XHTML1.0 仕様に関連する DTD のみを示します。

HTML

HTML 4.01 では、Strict、Transitional、Frameset の 3 つのドキュメント タイプが指定されています。


HTML 厳密な DTD

プレゼンテーション層を乱雑にせずにクリーンなマークアップが必要な場合は、このタイプを使用します。カスケード スタイル シート (CSS) と一緒に使用してください:


http://www.w3.org/TR/html4/strict.dtd ">


HTML 移行 DTD

移行 DTD には、W3C がスタイル シートに移動することを想定しているレンダリング属性と要素を含めることができます。読者がカスケード スタイル シート (CSS) をサポートしていないブラウザを使用していて、HTML のレンダリング機能を使用する必要がある場合は、このタイプを使用します:


http://www.w3.org/TR/html4/loose. dtd">


フレームセット DTD

フレームセット DTD は、フレームを含むドキュメントに使用する必要があります。 Frameset DTD は、frameset 要素が body 要素を置き換えることを除いて、Transitional DTD と同等です:


http://www.w3.org/TR/html4/frameset. dtd">

XHTML

XHTML 1.0 では、Strict、Transitional、および Frameset という 3 つの XML ドキュメント タイプを指定します。


XHTML 厳密な DTD

プレゼンテーション層を乱雑にせずにクリーンなマークアップが必要な場合は、このタイプを使用します。カスケード スタイル シート (CSS) と一緒に使用してください:

PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"
http://www.w3.org/TR/xhtml1 /DTD/xhtml1-strict.dtd">


XHTML 移行 DTD

移行 DTD には、W3C がスタイル シートに移動することを想定しているレンダリング属性と要素を含めることができます。読者がカスケード スタイル シート (CSS) をサポートしていないブラウザを使用していて、XHTML のレンダリング機能を使用する必要がある場合は、このタイプを使用します:

PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"
http://www.w3.org/TR/xhtml1 /DTD/xhtml1-transitional.dtd">


XHTML フレームセット DTD

フレームワークを使いたいときはこのDTDを使いましょう!

PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"
http://www.w3.org/TR/xhtml1 /DTD/xhtml1-frameset.dtd">

5.DOCTYPE 要素の構文

文法

HTML 最上位要素の可用性 "登録//組織//タイプタグ//定義言語" "URL"

構文要素の説明

トップレベル要素: DTD で宣言されたトップレベル要素のタイプを指定します。これは、宣言された SGML 文書タイプに対応します。 デフォルトはHTMLです。

可用性: 正式公開識別子 (FPI) が公的にアクセス可能なオブジェクトであるか、システム リソースであるかを指定します。デフォルトでは、値は PUBLIC または SYSTEM.PUBLIC になります。パブリックにアクセス可能なオブジェクトを表します。 SYSTEM は、ローカル ファイルや URL などのシステム リソースを表します。

登録: 組織が国際標準化機構 (ISO) に登録されているかどうかを指定します。

がデフォルトで、組織名が登録されていることを示します。

- 組織名が登録されていないことを示します。 Internet Engineering Task Force (IETF) および World Wide Web Consortium (W3C) は、ISO に登録された組織ではありません。

組織: !DOCTYPE 宣言によって参照される DTD (つまり、OwnerID) の作成と保守を担当するグループまたは組織の名前を指定します。 IETFはIETFです。 W3CはW3Cです。

Type: パブリック テキスト クラス、つまり参照されるオブジェクトのタイプを指定します。 デフォルトはDTDです。

タグ: パブリック テキストの説明、つまり、参照されるパブリック テキストの一意の説明名を指定します。背面にバージョン番号を付けることができます。デフォルトはHTMLです。

Definition: ドキュメントタイプの定義を指定します。

フレームセット フレームセットのドキュメント。

Strict では、スタイル シートがすでに十分に確立されているため、W3C 専門家が段階的に廃止したいと考えているすべての代表的な属性と要素が除外されます。

Transitional には、frameSet 要素を除くすべてのコンテンツが含まれます。

Language: パブリック テキスト言語、つまり参照されるオブジェクトの作成に使用される自然言語エンコード システムを指定します。言語定義は ISO 639 言語コード (大文字 2 文字) として記述されています。 JP のデフォルト。英語。

URL: 参照されるオブジェクトの場所を指定します。

6. ツールの確認

ページのコンテンツが DOCTYPE で宣言された標準に準拠しているかどうかを確認したい場合は、W3C が提供する検証ツールを使用できます:

http://validator.w3.org/

7.DOCTYPE 切り替え

最新のブラウザには、W3C 標準に準拠した Web ページと古いブラウザ用に設計された Web ページの両方をサポートするように設計されたさまざまなレンダリング モードが含まれています。このうち、Standards モード (厳密なレンダリング モード) は最新の標準に準拠した Web ページをレンダリングするために使用され、Quirks (包括的) モード (つまり、緩やかなレンダリング モードまたは互換性モード) は、設計された Web ページをレンダリングするために使用されます。従来のブラウザの場合。さらに、Mozilla/Netscape 6 では、古いバージョンの標準用に設計された Web ページをサポートするために、新しいほぼ標準モードが追加されていることに注意してください。

理論的には、これは非常に直感的なスイッチになるはずです。ページの 要素が、ページが標準 (XHTML1.0 など) に準拠していることを示している場合、ブラウザは標準モードに切り替わります。 doctype が指定されていない場合、または HTML 3.2 以前が指定されている場合、ブラウザは Quirks モードに切り替わります。このようにして、ブラウザは、古い非標準の Web ページを完全に放棄することなく、標準に準拠したドキュメントを正しく表示できます。 ただし、次のような状況も考えられます:

1. URL または相対 URL がありません

完全な doctype 宣言には、対応する文書型定義 (DTD) ファイルの URL を含めます。 URL が欠落している場合、または (完全修飾インターネット アドレスではなく) 相対パスが指定されている場合、doctype 宣言で指定されたモードに関係なく、ほとんどのブラウザーは Quirks モードに入ります。

2. 間違った形式の doctype

ブラウザは、doctype 宣言の形式と形式に非常に敏感です。不正な形式の doctype を認識できない場合、強制的に Quirks モードになります (既知の正しい doctype をコピーしてドキュメントに貼り付けることをお勧めします)。そして直接入力しないこと)。不正な形式の doctype の一般的な原因は、doctype の最初の部分と URL の間にスペースがないことです。 2 行の doctype を 1 行に折りたたむと、スペースが失われることがよくあります。

3. 移行ドキュメントタイプ

ブラウザが移行的な doctype を処理する場合、不整合が発生する可能性が最も高くなります。 IE と Opera は標準モードを使用し、Netscape 6 およびそれ以前のバージョンの Safari は Quirks モードを使用し、Netscape 7、Mozilla 1、およびそれ以降のバージョンの Safari は標準モードの耐障害性の高いバージョンである Netscape の Almost Standards モードを使用します。

4.不明なドキュメントタイプ

ブラウザが認識できない doctype を処理する方法にも矛盾があります。 IE と Opera は標準モードに入ります。つまり、認識されない doctype はブラウザにまだ統合されていない新しい標準であると想定されます。一方、Netscape 6 は、認識できない doctype に遭遇すると Quirks モードに切り替わります。

Doctype の切り替えは、さまざまなブラウザーでの不一致に気づき、さまざまな問題を積極的に回避できる場合、ブラウザーを正しいレンダリング モードにして Web ページを正しく表示する効果的な方法である可能性があります。

8. XHTML の使用上のヒント

1. 上記の DOCTYPE 宣言の直後に、拡張された

要素内に配置される XHTML 名前空間宣言があります。

http://www.w3.org/1999/xhtml">

2. XHTML 1.0 ページは正当な XML ドキュメントであり、XML ではタグと属性の大文字と小文字が区別されるため、わかりやすくするために、XHTML 1.0 ページ内のすべてのタグと属性は小文字を使用する必要があります。

HTML Tidy (http://tidy.sourceforge.net/) などの一部の無料ツールは、タグと属性を自動的に小文字に変換するのに役立ちます。

3. 要素を

要素に追加して、ページで使用する言語を宣言します。

4. XHTML では、すべての属性を引用符で囲む必要があります。

HTML Tidy (http://tidy.sourceforge.net/) などの一部の無料ツールは、すべての属性に引用符を自動的に追加するのに役立ちます。

5. XHTML では、すべての属性に値が必要です。

は HTML 4.0 のように記述することはできません:

は次のように記述する必要があります:

6. XHTML では、すべてのタグが閉じられている必要があります。

タグを閉じるには、コンテンツを含むタグを終了タグで閉じる方法と、空のタグの後にスペースと「/」を続ける方法があります。例:

これは許容可能な HTML であり、有効な XHTML でもあります。

7. コメント内容に「--」を使用しないでください。

「--」は XHTML コメントの最初と最後にのみ使用でき、コメントの内容には使用できません。次の記述方法は許可されません:

8. すべての特殊記号を HTML エンコードします。

W3C の XHTML/CSS/DOM の 3 つの仕様は、Web 世界における完全かつ厳密なシステムを形成しており、これら 3 つの仕様を「三位一体の化身」と呼んでいます。これら 3 つの仕様は、それぞれ Web ページの構造、表示、動作を表します。 Web ページをこれら 3 つのレイヤーに厳密に分割し、各レイヤーのコンテンツを互いに独立させるようにすると、ページの再利用性とモジュール性が向上し、ページの作成、保守、および変更のコストが大幅に削減されます。上記の階層化された目標を達成するには、構造関連のマークアップ (要素と属性) のみを含むように XHTML を作成する必要があります。したがって、Strict タイプの DTD の使用に慣れ、表現的な意味を持つタグをできるだけ早く放棄する必要があります (これらのタグは HTML 4.0 仕様で非推奨、つまり「非推奨」としてマークされており、将来のバージョンでは完全に放棄されます) XHTML); 古いテーブルベースのレイアウト方法をできるだけ早く放棄し、完全な CSS レイアウトを採用します。

9. おすすめの XHTML 関連書籍

HTML と XHTML の決定版ガイド、Chuck Musciano と Bill Kennedy 著。

「XHTML チュートリアル」、チェルシー・バレンタインとクリス・ミニックによる。

「ウェブサイトのリファクタリング」、ジェフリー・ゼルドマン著。
著者: Zhang Ziqiu
出典: http://www.cnblogs.com/zhangziqiu/

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

公式アカウントのキャッシュの更新の難しさ:バージョンの更新後のユーザーエクスペリエンスに影響を与える古いキャッシュを回避する方法は? 公式アカウントのキャッシュの更新の難しさ:バージョンの更新後のユーザーエクスペリエンスに影響を与える古いキャッシュを回避する方法は? Mar 04, 2025 pm 12:32 PM

公式アカウントのWebページはキャッシュを更新します。これはシンプルでシンプルで、ポットを飲むのに十分な複雑です。あなたは公式のアカウントの記事を更新するために一生懸命働きましたが、ユーザーはまだ古いバージョンを開くことができますか?この記事では、この背後にあるtwist余曲折と、この問題を優雅に解決する方法を見てみましょう。それを読んだ後、さまざまなキャッシュの問題に簡単に対処でき、ユーザーが常に新鮮なコンテンツを体験できるようになります。最初に基本について話しましょう。それを率直に言うと、アクセス速度を向上させるために、ブラウザまたはサーバーはいくつかの静的リソース(写真、CSS、JSなど)やページコンテンツを保存します。次回アクセスするときは、もう一度ダウンロードすることなく、キャッシュから直接検索できます。自然に高速です。しかし、このことは両刃の剣でもあります。新しいバージョンはオンラインです、

WebページのPNG画像にストローク効果を効率的に追加する方法は? WebページのPNG画像にストローク効果を効率的に追加する方法は? Mar 04, 2025 pm 02:39 PM

この記事では、CSSを使用したWebページへの効率的なPNG境界追加を示しています。 CSSはJavaScriptやライブラリと比較して優れたパフォーマンスを提供し、微妙または顕著な効果のために境界幅、スタイル、色を調整する方法を詳述していると主張しています

HTML5フォーム検証属性を使用してユーザー入力を検証するにはどうすればよいですか? HTML5フォーム検証属性を使用してユーザー入力を検証するにはどうすればよいですか? Mar 17, 2025 pm 12:27 PM

この記事では、ブラウザのユーザー入力を直接検証するために、必要、パターン、MIN、MAX、および長さの制限などのHTML5フォーム検証属性を使用して説明します。

< datalist>の目的は何ですか 要素? < datalist>の目的は何ですか 要素? Mar 21, 2025 pm 12:33 PM

この記事では、HTML< Datalist>について説明します。オートコンプリートの提案を提供し、ユーザーエクスペリエンスの改善、エラーの削減によりフォームを強化する要素。

< Progress>の目的は何ですか 要素? < Progress>の目的は何ですか 要素? Mar 21, 2025 pm 12:34 PM

この記事では、HTML< Progress>について説明します。要素、その目的、スタイリング、および< meter>との違い要素。主な焦点は、< Progress>を使用することです。タスクの完了と< Meter> statiの場合

HTML5のクロスブラウザー互換性のベストプラクティスは何ですか? HTML5のクロスブラウザー互換性のベストプラクティスは何ですか? Mar 17, 2025 pm 12:20 PM

記事では、HTML5クロスブラウザーの互換性を確保するためのベストプラクティスについて説明し、機能検出、プログレッシブエンハンスメント、およびテスト方法に焦点を当てています。

< meter>の目的は何ですか 要素? < meter>の目的は何ですか 要素? Mar 21, 2025 pm 12:35 PM

この記事では、html< meter>について説明します。要素は、範囲内でスカラーまたは分数値を表示するために使用され、Web開発におけるその一般的なアプリケーション。それは差別化< Meter> < Progress>およびex

< iframe>の目的は何ですか タグ?使用する際のセキュリティ上の考慮事項は何ですか? < iframe>の目的は何ですか タグ?使用する際のセキュリティ上の考慮事項は何ですか? Mar 20, 2025 pm 06:05 PM

この記事では、< iframe>外部コンテンツをWebページ、その一般的な用途、セキュリティリスク、およびオブジェクトタグやAPIなどの代替案に埋め込む際のタグの目的。

See all articles