[html 5]学習ノートに追加された非主体構造要素
8129 ワード
htmlに新しく追加された非主体構造要素は、header、footer、hgroup、address要素を含む追加情報を表すために主に使用されます.
1、ヘッダー要素
ヘッダー要素は、通常、ページまたはページ全体のブロックのタイトルを配置するために使用されるガイドおよびナビゲーション機能を有する構造要素であるが、データテーブル、検索フォーム、または関連するlogoピクチャなどの他のコンテンツを含んでもよい.
従来、div要素は、ヘッダ、コンテンツ、および下部を担持するのによく用いられていました.以下のようにします.
今は書き方を変えて、以下のようにします.
次のようにナビゲーションに使用します.
2、footer要素
footer要素は、上位の親コンテンツブロックまたはルートブロックの脚注として使用できます.footerは、通常、著者、関連読書リンク、著作権情報など、関連ブロックの脚注情報を含む.
過去にdiv要素を使用してコンテンツをロードしました.以下のようにします.
次のように書きます.
3、hgroup元素
hgroupは、タイトルおよびサブタイトルをグループ化する要素であり、hgroupは、通常、h 1~h 6の要素をグループ化し、例えば、1つのコンテンツブロックのタイトルおよびそのサブ要素をグループ化する.
4、address要素
address要素は、ドキュメントの作成者またはドキュメントのメンテナンス者の名前、Webサイトのリンク、電子メールボックス、実際のアドレス、電話番号など、ドキュメントに連絡情報を表示するために使用されます.addressは、これらのコンテンツを表示するだけでなく、ドキュメントに関連する連絡先のすべての連絡情報を表示するために使用されます.
5.html 5のアウトライン編成のルール
1)編成内容領域ブロックの表示
sectionなどの要素を使用して構造を作成する
2)暗黙編成内容領域ブロック
sectionなどの要素を使わず、ページの要求に応じてh 1~h 6級タイトルを書いて作成する
3)タイトルの等級付け
h 1~h 6は、タイトルのレベルが異なる.より低いレベルのhラベルを使用すると、下位の領域ブロックが生成される.同級以上のhラベルを使用すると、新しい領域ブロックが生成されます.
4)異なる領域ブロックで同じ見出しを使用する
1、ヘッダー要素
ヘッダー要素は、通常、ページまたはページ全体のブロックのタイトルを配置するために使用されるガイドおよびナビゲーション機能を有する構造要素であるが、データテーブル、検索フォーム、または関連するlogoピクチャなどの他のコンテンツを含んでもよい.
従来、div要素は、ヘッダ、コンテンツ、および下部を担持するのによく用いられていました.以下のようにします.
1 <body>
2 <div class="header"></div>
3 <div class="content"></div>
4 <div class="footer"></div>
5 </body>今は書き方を変えて、以下のようにします.
1 <body>
2 <head></head>
3 <article></article>
4 <footer></footer>
5 </body>次のようにナビゲーションに使用します.
1 <body>
2 <header>
3 <h1>IT new technology</h1>
4 <a href="http://www.jikexueyuan.com">jikexueyuan</a>
5 <nav>
6 <ul>
7 <li><a href="#">learn</li>
8 <li><a href="#">technology</li>
9 <li><a href="#">hacker</li>
10 </ul>
11 </nav>
12 </header>
13 </body>2、footer要素
footer要素は、上位の親コンテンツブロックまたはルートブロックの脚注として使用できます.footerは、通常、著者、関連読書リンク、著作権情報など、関連ブロックの脚注情報を含む.
過去にdiv要素を使用してコンテンツをロードしました.以下のようにします.
1 <body>
2 <div class="footer">
3 <ul>
4 <li><a href="#"> </li>
5 <li><a href="#"> </li>
6 <li><a href="#"> </li>
7 </ul>
8 </div>
9 </body>次のように書きます.
1 <body>
2 <footer>
3 <ul>
4 <li><a href="#"> </li>
5 <li><a href="#"> </li>
6 <li><a href="#"> </li>
7 </ul>
8 </footer>
9 </body>3、hgroup元素
hgroupは、タイトルおよびサブタイトルをグループ化する要素であり、hgroupは、通常、h 1~h 6の要素をグループ化し、例えば、1つのコンテンツブロックのタイトルおよびそのサブ要素をグループ化する.
1 <body>
2 <header>
3 <hgroup>
4 <h1> 1</h1>
5 <h2> 1.1</h2>
6 </hgroup>
7 <hgroup>
8 <h1> 2</h1>
9 <h2> 2.2</h2>
10 </hgroup>
11 </header>
12 </body>4、address要素
address要素は、ドキュメントの作成者またはドキュメントのメンテナンス者の名前、Webサイトのリンク、電子メールボックス、実際のアドレス、電話番号など、ドキュメントに連絡情報を表示するために使用されます.addressは、これらのコンテンツを表示するだけでなく、ドキュメントに関連する連絡先のすべての連絡情報を表示するために使用されます.
1 <body>
2 <address>
3 <a href="#">iwen</a>
4 <a href="#">ime</a>
5 </address>
6 </body>5.html 5のアウトライン編成のルール
1)編成内容領域ブロックの表示
sectionなどの要素を使用して構造を作成する
2)暗黙編成内容領域ブロック
sectionなどの要素を使わず、ページの要求に応じてh 1~h 6級タイトルを書いて作成する
3)タイトルの等級付け
h 1~h 6は、タイトルのレベルが異なる.より低いレベルのhラベルを使用すると、下位の領域ブロックが生成される.同級以上のhラベルを使用すると、新しい領域ブロックが生成されます.
4)異なる領域ブロックで同じ見出しを使用する