1. ブラウザのレンダリングモードとdoctype 一部の Web ページは標準に従って作成されていますが、多くは標準に従っていません。標準に準拠した Web ページを作成できない場合でも、ブラウザで標準に従ってページを正しく表示する必要があります。現在、多くの Web ページには非標準のコードが使用されていますが、それでも正常に動作しています。実際、古いブラウザ用に設計されたコードのほとんどは、新しいブラウザでも正しく表示されます (ただし、レンダリングは異なる場合があります)。その理由は何でしょうか?実際、最新の標準に厳密に従うと、それらのページの存在の基盤そのものが完全に破壊されてしまいます。もちろん、変化を期待するブラウザにとっては、これは受け入れられないものです。 ブラウザレンダリングモード 最新のブラウザには、標準に準拠した Web ページと古いブラウザ向けに設計された Web ページの両方をサポートするために、さまざまなレンダリング モードが含まれています。これらのうち、標準モード (厳密なレンダリング モードとも呼ばれます) は最新の標準に準拠した Web ページをレンダリングするために使用され、Quirks モード (緩いレンダリング モードまたは互換性モードとも呼ばれます) は従来のブラウザー用に設計された Web ページをレンダリングするために使用されます。また、Mozilla/Netscape 6 には、古いバージョンの標準向けに設計されたページをサポートする新しい Almost Standards モードがあることにも注意してください。 doctype 切り替えとは何ですか? 理論的には、これはかなり直感的なスイッチになるはずです。 doctype が現在の Web ページが標準 (つまり、HTML 4+ または XHTML 1+) ドキュメントであることを示している場合、ブラウザは標準モードに切り替わります。 doctype が指定されていない場合、または HTML 3.2 以前が指定されている場合、ブラウザは Quirks モードに切り替わります。これにより、ブラウザは、古い非標準の Web ページを完全に破棄することなく、標準に準拠したドキュメントを正しく表示できるようになります。 文書型切り替えの問題 欠落または相対 URL: 間違ったドキュメントタイプ: 移行ドキュメントタイプ: 2. 正しいDOCTYPE宣言を使用する 私たちは通常、Web ページを作成するときにこの点を見落としがちです (通常、書くのが面倒でブラウザのデフォルトを使用する私を含む)。Web ページのコーディング標準化の現在の傾向では、誰もがこの詳細を理解する必要があり、役に立ちます。諺にあるように、ルールがなければ秩序はない。 ほとんどの Web ドキュメントには先頭に doctype 宣言がありますが、多くの人はそれに注意を払っていません。これは、新しいドキュメントを作成するときに Web 作成ソフトウェアが適切に処理しない多くの詳細事項の 1 つです。多くの人が見落としていますが、doctype は標準に準拠するすべての Web ドキュメントで必須の要素です。 doctype はコードの検証に影響し、ブラウザが最終的に Web ドキュメントを表示する方法を決定します。 doctypeの役割 doctype 宣言は、ドキュメント内のマークアップを解釈するために読者が使用すべき一連のルールを示します。 Web ドキュメントの場合、「リーダー」は通常、ブラウザやバリデータなどのプログラムであり、「ルール」は W3C によって公開された文書型定義 (DTD) に含まれるルールです。 各 DTD には、Web ドキュメントのコンテンツをマークするために使用される一連のタグ、属性、およびプロパティが含まれています。さらに、どのタグが他のどのタグ内に出現できるかを規定するいくつかのルールも含まれています。各 Web 推奨標準 (HTML 4 Frameset や XHTML 1.0 Transitional など) には独自の DTD があります。ドキュメント内のマークアップが doctype 宣言で指定された DTD に従っていない場合、ドキュメントはコード検証に合格できないだけでなく、ブラウザーに正しく表示されない可能性があります。マークアップの不一致に関しては、ブラウザはバリデータよりも寛容です。ただし、doctype 宣言が間違っていると、Web ページが正しく表示されないか、まったく表示されないことがよくあります。 適切なDOCTYPEを選択する 正しい doctype 宣言を取得するには、DTD をドキュメントが従う標準に対応させることが重要です。たとえば、ドキュメントが XHTML 1.0 Strict 標準に準拠していると仮定すると、ドキュメントの doctype 宣言は対応する DTD を参照する必要があります。一方、doctype 宣言で XHTML DTD を指定しても、ドキュメントに古いスタイルの HTML タグが含まれている場合、これは不適切です。同様に、doctype 宣言で HTML DTD を指定しても、ドキュメントに XHTML 1.0 Strict タグが含まれている場合も不適切です。 場合によっては、doctype 宣言をまったく使用しないことも可能です。有効な doctype 宣言が指定されていない場合、ほとんどのブラウザは組み込みのデフォルトの DTD を使用します。この場合、ブラウザは組み込みの DTD を使用して、指定したマークアップを表示しようとします。一時的に急いでまとめたドキュメント(そのようなものはたくさんあります)の場合は、doctype 宣言を省略し、ブラウザのデフォルト表示を受け入れることを検討してください。 doctype 宣言を最初から記述し、任意の DTD を指すようにすることは完全に可能です。ただし、ほとんどの Web ドキュメントは W3C によって公開された国際的に認められた Web 標準のいずれかに従う必要があるため、これらのドキュメントには通常、次の標準の doctype 宣言のいずれかが含まれます。 HTML 2: <!DOCTYPE html PUBLIC "-//IETF//DTD HTML 2.0//EN"> HTML 3.2: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN"> HTML 4.01 厳密: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" " http://www.w3.org/TR/html4/strict.dtd "> HTML 4.01 移行: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 移行//EN" " http://www.w3.org/TR/html4/loose.dtd "> HTML 4.01 フレームセット: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 フレームセット//EN" " http://www.w3.org/TR/html4/frameset.dtd "> XHTML 1.0 厳密: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 厳密//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd "> XHTML 1.0 トランジショナル: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 トランジショナル//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> XHTML 1.0 フレームセット: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 フレームセット//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd "> XHTML 1.1: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" " http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd "> XHTML 1.1 プラス MathML プラス SVG: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 プラス MathML 2.0 プラス SVG 1.1//EN" " http://www.w3.org/2002/04/xhtml-math-svg/xhtml-math-svg.dtd "> 上記の doctype 宣言に加えて、特別な要件を持つ一部のドキュメントでは、他の宣言もいくつか使用されます。 doctype 宣言は通常、<html> タグやその他のドキュメント コンテンツの前の、ドキュメントの最初の行にあります。 XHTML ドキュメントでは、doctype の前に XML 処理命令 (XML プロローグとも呼ばれます) が付く場合があることに注意してください: <?xml version="1.0" encoding="utf-8"?> Web ページが正しく表示され、検証に合格することを保証するには、正しい doctype を使用することが重要です。コンテンツに反する不正確な、または不正な形式の doctype が、多くの問題の原因となります。 DW を使用して Web ページを設計する場合、新しいファイルを作成すると、コードの先頭に次の内容が表示されます。 標準に準拠したサイトの作成を開始するときに最初に行う必要があるのは、ニーズに合った DOCTYPE を宣言することです。 このページの元のコードを見ると、最初の行が次のようになっていることがわかります: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> 有名なウェブデザインソフトウェア開発会社 Macromedia や、デザインマスター Zeldman の個人ウェブサイトなど、基準を満たしたサイトをいくつか開くと、同じコードが見つかります。標準を満たす他のサイト (k10k.net など) には、次のコードがあります。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">br >.完全なコードは次のとおりです。
どの DOCTYPE を選択すればよいでしょうか? たとえば、マネキンが服を着替える。モデルはデータのようなもので、服は表現形式です。モデルと服は別物なので、自由に着せ替えることができます。 HTML4では、データとプレゼンテーションが混在しており、プレゼンテーション形式を一気に変更することは非常に困難でした。ハハ、ちょっと抽象的ですね。この概念は、申請の過程で徐々に理解していく必要があります。 補充する 4. DOCTYPE HTML PUBLICの公式定義はこうだ !DOCTYPE -------------------------------------------------------------------------------- HTML ドキュメントが準拠するドキュメント型定義 (DTD) を指定します。 Microsoft® Internet Explorer 6 の新機能は何ですか?この宣言を使用すると、Internet Explorer 6 以降を標準準拠モードに切り替えることができます。 文法 HTML トップレベル要素の可用性「登録 // 組織 // タイプ タグ // 定義言語」「URL」 可能な値 トップレベル要素: DTD で宣言されたトップレベル要素タイプを指定します。これは宣言された SGML ドキュメント タイプに対応します。 HTML のデフォルト。 .HTML です。 可用性: 正式な公開識別子 (FPI) がパブリックにアクセス可能なオブジェクトであるか、システム リソースであるかを指定します。 PUBLIC デフォルト。パブリックにアクセス可能なオブジェクト。 SYSTEM ローカル ファイルや URL などのシステム リソース。 登録済み: 組織が国際標準化機構 (ISO) に登録されているかどうかを指定します。 + デフォルト。組織名は既に登録されています。 - 組織名が登録されていません。 Internet Engineering Task Force (IETF) と World Wide Web Consortium (W3C) は登録された ISO 組織ではありません。 組織: !DOCTYPE 宣言によって参照される DTD の作成と保守を担当するグループまたは組織の名前 (つまり OwnerID) を指定します。 IETF IETF。 W3C W3C。 タイプ: パブリック テキスト クラス、つまり参照されるオブジェクトのタイプを指定します。 DTD のデフォルト。 .DTD。 ラベル: 参照されるパブリック テキストの一意の説明的な名前であるパブリック テキストの説明を指定します。その後にバージョン番号が続く場合があります。 HTML のデフォルト。 .HTML です。 定義: ドキュメント タイプ定義を指定します。フレームセット フレームセット ドキュメント。 Strict では、スタイルシートがすでに確立されているため、W3C の専門家が段階的に廃止したいと考えている一般的な属性と要素がすべて除外されます。 Transitional には、frameSet 要素を除くすべてのコンテンツが含まれます。 言語: 公開テキスト言語、つまり参照オブジェクトの作成に使用される自然言語エンコード システムを指定します。言語定義は ISO 639 言語コード (大文字 2 文字) として記述されます。 EN デフォルト。英語。 URL: 参照オブジェクトの場所を指定します。 注記 この宣言は、ドキュメントの先頭、HTML タグの前に記述する必要があります。 !DOCTYPE 要素には終了タグは必要ありません。 この要素は、Microsoft® Internet Explorer 3.0 の HTML で使用できます。 この宣言を使用すると、Internet Explorer 6 以降で厳密な標準準拠モードに切り替えることができます。これを有効にするには、ドキュメントの先頭に !DOCTYPE 宣言を含め、有効なタグと、場合によっては定義や URL を指定します。 注意: 標準互換モードでは、他のバージョンの Internet Explorer との互換性は保証されません。標準準拠モードをオンにすると、ドキュメントのレンダリング動作が Internet Explorer の将来のバージョンと異なる可能性があります。コンテンツが本質的に固定されている場合(CD に書き込まれている場合など)、このモードは使用しないでください。 例 次の例は、!DOCTYPE 宣言を使用してドキュメントが準拠する DTD を指定し、Internet Explorer 6 以降を標準準拠モードに切り替える方法を示しています。 次の例の宣言はすべて、HTML 4.0 DTD への準拠を指定します。 2 番目の宣言では「Strict」を指定します。最初の宣言は指定されていません。これら両方の宣言により、Internet Explorer 6 以降が標準準拠モードに切り替わります。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"> 次の例の宣言はすべて、「Transitional」HTML 4.0 DTD への準拠を指定します。 2 番目の宣言では、DTD の URL を指定します。最初の宣言は指定されていません。 2 番目の宣言により、Internet Explorer 6 以降が標準準拠モードに切り替わります。最初の声明はそうではありません。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> |
>>: CSSは固定比率のブロックレベルコンテナを簡単に実装できる
この記事では、参考までにMySQL 5.7.24圧縮パッケージのインストールチュートリアルを紹介しま...
SSH 公開鍵認証は、SSH 認証方式の 1 つです。 SSH パスワードフリーのログインは公開鍵認...
目次1. Vueリスナー配列2. vueが配列の変更を監視できない状況1. Vueリスナー配列Vue...
目次1. ページレンダリング2. タグを切り替える3. タグを削除するこのようなタグはどのように記述...
目次1. 切り捨て操作1.1 MySQL truncate はどのような操作を実行しますか? 1.2...
数日前、同僚がポイントモールプロジェクトを受け取りました。このプロジェクトには、カードやクーポンをギ...
問題を見つける最近、仕事中に問題が見つかりました。問題は、MySQL ディスクがいっぱいだったことで...
この記事では、マウス追従ゲームを実装するためのjsの具体的なコードを参考までに共有します。具体的な内...
この記事では、セカンダリメニュー効果を実現するためのJavaScriptの具体的なコードを参考までに...
概要es6 では、配列またはオブジェクトから指定された要素を取得する新しい方法が追加されました。これ...
アンカーポイントの設定<a name="トップ"></a>...
目次需要背景思考分析UI 表示始める1. 支払いコンポーネントテンプレートを作成する2. 支払いコン...
まず、Web ページのスタイルの形成は、主に Web ページのレイアウト設計、ページの色処理、画像と...
この記事では、参考までにMySQL 5.7.18 MSIインストールチュートリアルを紹介します。具体...
MacOS Catalina アップグレード後の VMware ブラック スクリーンに対する完璧なソ...