html5 の文書型宣言を使用することをお勧めします:
<!DOCTYPE html>
html5 仕様によると:
ドキュメントに正しい言語を設定するには、HTML ルート要素に lang 属性を指定することを強くお勧めします。これは、音声合成ツールが使用すべき発音を決定したり、翻訳ツールが翻訳時に従うべきルールを決定したりするのに役立ちます。
言語コード表はここにリストされています。
<html lang="en"></html>
IE は、現在のページの描画に使用する IE バージョンを決定する特定のメタ タグをサポートしています。強い特別なニーズがない限り、エッジ モード に設定して、IE がサポートする最新のモードを採用するように通知するのが最善です。
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
自己終了要素の末尾にスラッシュを追加しないでください – HTML5仕様にはこれがオプションであると明確に記載されています。
<input type="text"/>
<input type="text">
オプションの終了タグを省略しないでください。
<ul> <li></ul>
<ul> <li></li></ul>
cssとjsのtype属性を省略します。 html5 における上記 2 つのデフォルトの type 値は text/css と text/javascript であるため、type 属性は通常は無視できます。これは古いバージョンのブラウザでも安全で信頼性があります。
h1、p などのセマンティック タグを使用します。
<!DOCTYPE html> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">Document 标题
子标题
文本段落
加粗文本
HTML 標準とセマンティクスに従うように努めますが、実用性を犠牲にしないでください。使用するタグを最小限にし、複雑さを常に最小限に抑えるようにしてください。
<span class="avatar"> <img src="avatar.jpg"></span>
<img class="avatar" src="avatar.jpg">
完全なページは、構造 (html)、パフォーマンス (css)、動作 (js) の 3 つの部分に分割されます。それらをクリーンで保守しやすいコードにするには、できるだけ分離する必要があります。
構造、パフォーマンス、動作の分離を厳密に確保し、3 つの間の過度の相互作用やつながりを避けるようにしてください。つまり、ドキュメントとテンプレートには構造的な HTML のみを含めるようにして、すべてのプレゼンテーション コードをスタイル シートに移動し、すべてのアクション動作をスクリプトに移動します。さらに、それらの間のつながりをできる限り小さく保つために、ドキュメントとテンプレートに導入されるスタイル ファイルとスクリプト ファイルはできる限り少なくなります。
明確な階層化とは次のことを意味します:
HTML タグと属性 (カスタム属性を含む) はすべて小文字であり、大文字は使用しないでください。
ラベルにデータをバインドする必要がある場合は、html5 のカスタム属性 data-* を使用して関連データをバインドしてください。
<h1 data-age="20">张三</h1>
ブール型プロパティは値なしで宣言できます。 xhtml 仕様では値を割り当てる必要がありますが、html5 仕様では必要ありません。
<input type="text" disabled><input type="checkbox" value="1" checked><select> <option value="1" selected>1</option> <option value="2"></option></select>
html 属性には単一引用符ではなく二重引用符を使用してください。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
