16 の XHTML1.0 と HTML の互換性ガイドラインの概要

16 の XHTML1.0 と HTML の互換性ガイドラインの概要

1.ページを XML タイプとして宣言しないでください。ページでは UTF-8 または UTF-16 文字セットを使用する必要があります。

2.空要素タグ(コンテンツを含めることができないタグ)の終了文字 > の前にスラッシュ / を追加します(例: <br />、<hr /> など)。

3. 空でない要素(タイトルや段落などのコンテンツを格納するために使用されるタグ)に空のコンテンツがある場合は、空の要素と同じ終了方法を使用するのではなく、空白文字を指定します。たとえば、コンテンツのない P タグがある場合は、<p /> ではなく <p> </p> と記述してください。

4.スタイルやスクリプトのコンテンツに <、&、]]> または 2 つの連続したハイフン -- が表示される場合は、外部ファイルを使用してインポートしてください。

5.要素の属性値に改行や複数のスペースを入れないでください。

6.ドキュメントのヘッドセクションに複数の isindex 要素を含めないでください(使用しないことをお勧めします)。この要素は推奨されません。
isindex: ブラウザにダイアログ ボックスが表示され、ユーザーに 1 行のテキストを入力するよう促します。
HTML 4 では、この要素は廃止され、代わりに INPUT 要素が使用されるようになりました。 isIndex の tagName プロパティは入力を返します。
この要素はブロック要素であり、終了タグが必要です。
次の例では、ISINDEX 要素を使用してデフォルトのプロンプトを置き換えます。
<isindex prompt="検索するインデックスキーワードを入力してください" />

7.要素の言語を指定する場合は、lang 属性と xml:lang 属性を使用します。xml:lang の値が優先されます。

8.要素の識別子として id 属性を使用し、 name 属性の使用は避けてください。特に、a、applet、form、frame、iframe、img、map の要素では、 name 属性を識別子として使用することは推奨されません。

9.ページのドキュメント文字セットを定義します。XML ドキュメントの文字セットを定義するには <?xml version="1.0" encoding="UTF-8"?> を使用し、XHTML の文字セットを定義するには <meta http-equiv="Content-type" content="text/html; charset=UTF-8" /> を使用します。

10.ブール型要素の属性値には、属性名を使用してください(例:checked="checked")。ブール型要素には、compact、nowrap、ismap、declare、noshade、checked、disabled、readonly、multiple、selected、noresize、defer などがあります。

11. HTML4 および XML ドキュメント オブジェクト モデルでは、HTML 要素名と属性名が大文字の形式で返されることが規定されています。 XHTML では、要素名と属性名は小文字で返されます。

12.属性値のアンパサンドを&amp;で置き換える

13. XHTML では、CSS スタイル タグと属性名は小文字にする必要があります
HTML テーブルでは、解析時に tbody は自動的に補完されますが、XML ではそうではないため、CSS セレクターで使用する場合は tbody 要素を自分で追加する必要があります。
CSS で id 属性を持つ要素を選択する場合は、# セレクターを使用します
CSS でクラス属性を持つ要素を選択する場合は、. セレクタを使用します

14. XML ドキュメントを解析するときに Style 要素を使用するにはどうすればよいでしょうか? HTML4 および XHTML では、スタイル要素を使用してドキュメント内のスタイル ルールを定義できます。XML では、XML スタイルシートを使用してスタイル ルールを定義します。このルールと互換性を持たせるには、 XML ドキュメントを解析するときにスタイル要素を使用する必要がある場合、スタイル要素は識別子として id 属性を使用する必要があり、それを参照する XML スタイルシートが必要です。例:

<?xml-stylesheet href="http://www.w3.org/StyleSheets/TR/W3C-REC.css" type="text/css"?>
<?xml-stylesheet href="#internalStyle" type="text/css"?>
<!DOCTYPE html
パブリック "-//W3C//DTD XHTML 1.0 厳密//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<ヘッド>
<title>内部スタイルシートの例</title>
<スタイル タイプ="text/css" id="内部スタイル">
コード {
色: 緑;
フォントファミリ: 等幅;
フォントの太さ: 太字;
}
</スタイル>
</head>
<本文>
<p>
W3CGroup が XHTML と HTML の互換性に関する 16 のガイドラインを導入しました。
<code>http://www.w3cgroup.com/article.asp?id=252</code> を参照してください。
</p>
</本文>
</html>


15. HTML および XML 内の空白文字に注意してください。 HTML 文書では有効な文字でも、XML では有効でない文字があります。たとえば、HTML ではフォームフィード文字 (U+000C) はスペースとして解析されますが、XHTML では XML の文字定義により無効になります。

16特殊文字 &apos; (省略記号、U+0027) はXML1.0 で導入されましたが、HTML には登場しませんでした。&apos; を &#39; に置き換えると、HTML4 で使用できるようになります。

<<:  Docker Secretの管理と使用の詳細な説明

>>:  MySQL で lower_case_table_names を記録する際の落とし穴の詳細な説明

推薦する

Linux での MySQL のインストールに関するチュートリアル

目次1. 古いバージョンを削除する2. サーバーのカーネルタイプを確認し、適切なバージョンをダウンロ...

Angular の 12 の典型的な問題について簡単に説明します

目次1. Angular 2 アプリケーションのライフサイクル フックとは何ですか? 2. Angu...

Javascript サンプル プロジェクトでの虫眼鏡効果の実装プロセス

目次序文事例: JD.com の虫眼鏡効果の模倣オフセットシリーズクライアントシリーズスクロールシリ...

Ubuntuはポート22を開きます

シナリオssh 経由で Ubuntu サーバーに接続するには、xshell ツールを使用する必要があ...

MySQL 基本チュートリアル: DML ステートメントの詳細な説明

目次DMLステートメント1. レコードを挿入する2. 記録を更新する3. シンプルなクエリレコード4...

JavaScript で矢印関数を使用できないシナリオはどれですか

目次1. オブジェクトメソッドを定義する2. プロトタイプメソッドを定義する3. イベントコールバッ...

コーディングスキルを向上させるためのJavaScriptのヒント

目次1. 一意の値をフィルタリングする2. 短絡評価2.1 シナリオ例3. ブール変換4. 文字列を...

MySQL クロステーブルクエリとクロステーブル更新

SQL の基礎知識がある友人は、「クロステーブル クエリ」について聞いたことがあるはずですが、クロス...

ブログデザイン ウェブデザイン デビュー

私がデザインした最初の Web ページは次のとおりです。 私はこの業界に7年間在籍し、プログラミング...

JavaScript でロジック判定コードを最適化する方法

序文日常生活で使用する論理的判断文には、if...else...、switch...case...、...

ウェブ開発で遭遇した問題と経験

<br />以下は開発中に遭遇した問題と、そこから得た経験です。デバッグに時間がかかりま...

MySQL における distinct と group by の違い

簡単に言うと、distinct は重複を削除するために使用され、group by は統計を集計するよ...

React で Antd の Form コンポーネントを使用してフォーム機能を実装する方法

1. 構造部品1. フォームには、入力コントロール、標準フォーム フィールド、ラベル、ドロップダウン...

ログインインターセプションを実装するためのVueルーティング

目次1. 概要2. ログインインターセプションを実装するためのルーティングナビゲーションガード1. ...

純粋な HTML+CSS でオリンピック リングを実装するためのサンプル コード

レンダリング コード - 青と黄色のリングを例に挙げます <div class="コ...