HTML5のnavタグの詳しい説明-H5 チュートリアル-php.cn

HTML5のnavタグの詳しい説明

黄舟

リリース： 2017-03-14 15:42:45

オリジナル

7901 人が閲覧しました

nav タグは通常、Web ページ上に navigation バーを作成するために使用され、ページの一部のセルフナビゲーションとして使用できます。ここでは、HTML5 の nav タグの学習メモを簡単に見ていきます。

nav タグフルネームナビゲーションは、名前が示すように、ナビゲーションを意味します。 HTML5 の関連標準によると、その定義は次のとおりです: 「他のページまたはページ内の一部にリンクしているページのセクション:
ナビゲーションリンクのあるセクション」中国語訳はおそらく「あるセクションの」を意味します。他のページまたはページ内の一部にリンクしているページ:ナビゲーションリンクのあるセクション。" 現在のページのページまたは領域: ナビゲーションリンクを含む領域。" nav タグの機能はここで非常に明確に定義されています。header と同様に、それがメインナビゲーションである必要があるか、ページの他の部分のサブナビゲーションであるかは指定されていません。以下のように:

XML/HTML Code复制内容到剪贴板
<h3>gbin1.com文章列表</h3>
<nav>
    <ul>
        <li><a href="#html5">HTML5文章介绍</a></li>
        <li><a href="#css3">CSS3文章介绍</a></li>
        <li><a href="#jquery">jQuery文章介绍</a></li>
        <ul>
</nav>

ログイン後にコピー

上記の例では、これは単なる記事ナビゲーションの領域であることがわかります。また、nav を使用して小さなページ内を定義することもできます。ナビゲーション。ただし、ページ上のすべてのリンクグループを nav タグ内に配置する必要はありません。これは主にページのメインナビゲーションブロックで構成されます。たとえば、通常、Web サイトのフッターには、利用規約、Web サイトの紹介、著作権声明などを含む一連のリンクが配置されます。このとき、通常はナビゲーションの代わりにフッターを使用します。
ページには、ページ全体またはさまざまな部分のナビゲーションとして機能する複数の nav タグを含めることができます。以下の例では、2 つの nav タグがあり、1 つは Web サイトのメインナビゲーションで、もう 1 つは現在のページ自体の補助リンクナビゲーションです。

XML/HTML Code复制内容到剪贴板
<h1>雨打浮萍</h1>
<nav>
    <ul>
        <li><a href="/">首页</a></li>
        <li><a href="#">html+css</a></li>
        ...more...   
    </ul>
</nav>
<article>
    <header>
        <h1>html5语义化标签之结构标签</h1>
        <p><span>发表于</span>2011-12-22</p>
    </header>
    <nav>
        <ul>
            <li><a href="#">子导航</a></li>
            <li><a href="#">子导航</a></li>
            ...more...   
        </ul>
    </nav>
    <p>
        <section id="public">
            <h1>section里面仍然可以再用h1标签</h1>
            <p>...more...</p>
        </section>
        <section id="destroy">
            <h1>section里面仍然可以再用h1标签</h1>
            <p>...more...</p>
        </section>
        ...more... </p>
    <footer>
        <p><a href="#">关于我们</a> |   
            <a href="#">友情链接</a> |   
            <a href="#">杂七杂八</a></p>
    </footer>
</article>
<footer>
    <p><small>© copyright 2011 </small></p>
</footer>

ログイン後にコピー

nav タグ自体にリストを含める必要はありません。他のコンテンツ形式を含めることもできます。

りー

以上がHTML5のnavタグの詳しい説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。