H5新要素

高洛峰
高洛峰オリジナル
2016-10-12 10:51:121305ブラウズ

H5新しい要素

1.article要素(タグ)

記事やブログなどの独立したコンテンツブロックを定義するために使用されます。

article 要素内に他の要素を入れ子にすることができ、独自の head、tail、body などのコンテンツを含めることができます。通常は、article 要素のみが使用されます。独立した完全なコンテンツの場合、それが単なるコンテンツの場合は、セクション要素を使用する必要があります。

2. セクション要素

記事内の章を定義するために使用されます (通常、タイトルと段落の内容が必要です)

ドキュメント内の特定のコンテンツ ブロックを定義するために使用され、コンテンツを追加するために使用されます。ページコンテンツチャンク上。

section要素はドキュメントの主要なコンテンツを定義できます

一言でまとめると、その機能はコンテンツをセグメント化し、ページを分割することです

divとの違いに注意してください。divは形式の独立性を強調します。 、セクションではコンテンツに依存しないことを強調していますが、そのセマンティクスに注意してください。

3.article要素とsection要素の違い

異なるセマンティクス

article要素はコンテンツの独立性を強調します

section要素はコンテンツの関連性を強調します

article要素は独立した完全なコンテンツですが、セクション要素のページコンテンツはブロックに分割されます

類似点

これらは本質的にセマンティクスを備えた div ブロック要素です

それぞれ

として見ることができます

4. Side 要素

Side 要素は通常、セットアップに使用されますサイドバー

要素の外にある記事コンテンツを定義するために使用されます。ただし、コンテンツが記事要素内のコンテンツに関連している場合に限ります

同時に、メインコンテンツの補助情報として記事要素内にネストして使用することもできます。コンテンツ関連の参考資料、名詞の説明など

5.nav 要素

ディレクトリ、ナビゲーション バー、ハイパーリンクの定義に使用されます

通常、すべてのハイパーリンクが nav 要素に配置されるわけではありません。ドキュメントはナビゲーションに配置されます

記事ページでは、テキストの目次へのハイパーリンクを作成するためにもナビゲーションを使用できます

6. 時間要素

マイクロフォーマットの概念

HTML5 のマイクロフォーマットは、 HTML5 メソッドの新しいタグを使用して、ニュース イベントの日時、記事の公開日などの追加情報を Web ページに追加します。

HTML5 のマイクロフォーマットは、ブラウザによるデータの抽出を簡素化し、検索エンジンを容易にする

time 要素

Time は HTML5 新しい要素

time 要素は 24 時間内の特定の時刻または日付を表し、時差が許容されることを示します。多くの形式で日付と時刻を定義できます

datetime 属性表現の日付と時刻は "T" テキストで区切る必要があります。"T" は時間を表します。最後から 2 番目の行に注意してください。時刻と Z テキストは、次のことを意味します。マシンをエンコードする UTC 標準時間を使用する場合、ローカル時間がエンコードされている場合は、時差を追加する必要はありません。

pubdate属性はオプションのタグです

7.time要素の例

8.hgroup要素

通常使用タイトルをグループ化するために、通常配置されますヘッダーにありますが、必須ではなく絶対的でもありません

9. address要素

通常、名前、メールアドレス、電話番号、住所などの連絡先情報を記述するために使用されます

address要素の内容は、斜体で表示されます

10. 新しいレイアウトの利点

1. 形式よりも内容に重点を置きます

2. 人に優しい: よりセマンティックで、より説明的で、より直観的でコードの可読性が向上します。

3. コンピュータに優しい: ブラウザが解析しやすく、検索エンジンがドキュメントのコンテンツをクロールしやすくなります

4. コードがより簡潔になりました

11. Figure 要素

Figure/figcaptio は HTML5 の新しい要素です

Figure要素はメディア組み合わせ要素であり、画像、アイコンなどの他のメディア要素を組み合わせたものです。

12.figcaptio要素

Figure要素のタイトルを定義するために使用されます

13。 video

src 属性: オーディオアドレス

LOOP 属性: 繰り返し再生するかどうか

autoplay 属性: 自動的に再生するかどうか

Controls 属性: コントロールを追加

Poster 属性: ビデオが読み込まれる前に表示する内容

最初のタイプ:

はあなたのブラウザではサポートされていません

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。