違い: 1. ドキュメント宣言に関しては、html コードは非常に長くて覚えにくいですが、html5 の宣言は「<!DOCTYPE html>」という構文で比較的単純です。 2. HTML には構造的なセマンティック タグがありませんが、HTML5 では多くの新しいセマンティック タグが追加されています。 3. HTML5 は描画できますが、html は描画できません。
このチュートリアルの動作環境: Windows 7 システム、HTML5 バージョン、Dell G3 コンピューター。
html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
html5: ドキュメントの宣言は比較的単純で、プログラマーがすばやく読み取って理解するのに役立ちます。開発する。
<!DOCTYPE html>
html:
構造的な意味タグはありません(平たく言えば、読むのに不便です)どこが頭でどこが尾なのかはわかりません)
html5:
多くのセマンティック タグを追加しました。
コード構造が明確になり、読みやすさが向上しました。コード。
以下は HTML5 のセマンティック タグの一部です:
< title></title>
: 短く、説明的、ユニーク (検索エンジンのランキングが向上します)
<hn></hn>
: h1~h6 の階層見出し。ページ情報の階層関係を作成するために使用されます。
<header></header>
: ヘッダーには通常、Web サイトのロゴ、メイン ナビゲーション、サイト全体のリンク、検索ボックスが含まれます。
は、ページ内の一連の紹介コンテンツまたはナビゲーション コンテンツをマークするのにも適しています。
<nav></nav>
: ナビゲーションをマークします。ドキュメント内の重要なリンク グループにのみ使用されます。
<main></main>
: ページのメイン コンテンツ。ページ上で 1 回のみ使用できます。 Web アプリケーションの場合は、その主要な機能を囲みます。
<article></article>
: ドキュメント、ページ、アプリケーション、または独立したコンテナを表します。
<section></セクション>
: 同様のテーマを持つコンテンツのグループ。たとえば、Web サイトのトップページは、紹介、ニュース項目、連絡先情報などのセクションに分割できます。
<aside></aside>
: 引用、サイドバー、記事へのリンクのセット、広告、フレンドリー リンク、関連製品リストなどを含むサイドバー列を指定します。
<footer></footer>
: フッターは、親が本文の場合にのみ、ページ全体のフッターになります。
<small></small>
: 詳細を指定し、免責事項、注釈、署名、著作権を入力します。 「利用規約」や「プライバシー ポリシー」などの長い法的記述ではなく、短いフレーズにのみ使用してください。
<strong></strong>
: コンテンツの重要性を示します。
<em></em>
: コンテンツの重要なポイントをマークします (主に段落テキストのセマンティクスを改善するために使用されます)。
HTML5 では、em は強調を表す唯一の要素であり、strong は重要度を表します。
: 実用的な目的で読者に思い出させるテキストのブロックであり、追加の重要性は伝えません
: 時間をマークします。 datetime 属性は特定の形式に従います。この属性を省略した場合、テキスト コンテンツは正当な日付または時刻形式である必要があります。関連性がなくなった時間には s のタグが付けられます。
: 略語の説明。 title 属性を使用してフルネームを指定します。これは最初にのみ使用する場合は問題ありません。 <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:css;toolbar:false">abbr[title]{
border-bottom:1px dotted #000;
}</pre><div class="contentsignin">ログイン後にコピー</div></div><dfn></dfn><p>: 定義用語要素は、定義のすぐ隣になければなりませんが、説明リスト dl 要素で使用できます。 <code>
: 著者、個人、または組織の連絡先情報 (電子メール アドレス、連絡先ページへのリンク)。ページ全体の作成者の連絡先情報を提供する場合、通常はページレベルのフッターに配置されます。文書やその他のコンテンツを含めることはできません。
: コードをマークします。サンプル コードまたはファイル名が含まれています (< > )
: フォーマット済みのテキスト。テキスト固有の改行とスペースを保持します。
HTML5 が登場する前は、Web フロントエンド開発者は HTML ページに動的に画像を描画できませんでした。 HTM5 では、キャンバスに相当する新しい