戦闘にフロントエンドの開発を取得する:HTML5セマンティックタグ

HTML5セマンティックタグ

1. <記事>

任意のページには、このような記事/ブログ/ニュース/物語/フォーラムの投稿/コメントので、任意の独立したコンテンツとして、コンテンツ領域の独立することができます。

<article>
    <header>
        <h1>文章标题</h1>
        <p>发布时间:<time pubdate='2019-05-06'>2019-05-06</time></p>
        <p>作者:xxx</p>
    </header>
    <p>文章内容.........</p>
    <p>文章内容.........</p>
</article>

2. <節>

そのような他の章、ヘッダや物品等のドキュメントセクション、セグメント、で定義されます。例えば、我々は、物品のサブセクションを行っています。

<article>
    <header>
        <h1>文章标题</h1>
        <p>发布时间:<time pubdate='2019-05-06'>2019-05-06</time></p>
        <p>作者:xxx</p>
    </header>
    <section>
        <h2>章节一的标题</h2>
        <p>文章内容.........</p>
    </section>
    <section>
        <h2>章节二的标题</h2>
        <p>文章内容.........</p>
    </section>
</article>

<節>内容とタイトルのセットが含まれている必要があります。内容はタイトルでない場合は、<節>を使用することは推奨されません。

3. <ナビゲーション>

ページのナビゲーション領域を定義します。

<nav>
    <a href='/a'>页面a</a>
    <a href='/b'>页面b</a>
    <a href='/c'>页面c</a>
</nav>

4. <余談>

メインのコンテンツ領域よりもページのコンテンツを定義します(たとえば、サイドバーなど)

5. <ヘッダ>

<ヘッダ>複数のコンテンツプレゼンテーションの表示を定義するための記述ドキュメントヘッダ領域、。

誰もがあなたが乱雑フルスタックエンジニアによるフロントエンドエンジニア、さらには道になるため大量のリソースを共有するために、簡単で効率的かつ無料の学習に役立つために。私たちは、フルスタックの学習Exchangeフロントエンド円をお勧めするためにここにいる:784783012は、交流と共通の進捗状況を学習し、×××議論に流入へようこそ。
学習の本当の始まりは、必然的に開始する場所がわからないだろう場合は、非効率につながる学習を継続する自信に影響を与えます。
しかし、最も重要なことは、私がキーテクノロジーを習得する必要があるかわからないで、頻繁に、ピット学習を強化多くの時間を無駄に終わる、それが効果的か、必要な資源です。

フロントの学習、我々は深刻です

6. <フッタ>

通常、連絡先情報などの文書作成者、著作権、使用条件を含む説明文書底面積、あなたは複数の<フッタ>を使用することができ、文書の一般的な構造を分けることができます

戦闘にフロントエンドの開発を取得する:HTML5セマンティックタグ

以下では、より詳細な意味ラベルでラベルを無視される可能性が高くなります。

7. <フィギュア>和<figcaption>

別<図>定義フローコンテンツ(画像、図、写真、コード、等)。
<figcaption> <図>ヘッダに定義さ、図形要素は、通常、最初または最後の子要素を配置しました

おすすめ

転載: blog.51cto.com/14284898/2402960