ホームページ  >  記事  >  ウェブフロントエンド  >  HTML5 の新しいタグと属性の概要

HTML5 の新しいタグと属性の概要

不言
不言オリジナル
2018-07-21 11:42:061818ブラウズ

この記事では、HTML5 の新しいタグと属性の概要を説明します。必要な方はぜひ参考にしてください。

IE9以下を除く基本的に誰でも利用できるHTML5の新機能を集めてまとめます。

HTML5 構文

そのほとんどは html の構文を継承しています

違い: 先頭部分

文字エンコーディングが簡潔になり、

は大文字と小文字が区別されなくなり、

はチェックされた、選択されたのと同様のブール値を追加します

引用符は省略可能ですが、コーディング規約上推奨されていません

終了文字を省略できるタグと完全に省略できるタグがあります。

タグの追加:

1. 構造タグ

(1) セクション: 独立したコンテンツ ブロック。h1 ~ h6 を使用してドキュメントの構造を示すアウトラインを形成できます。章、ヘッダー、フッター、またはヘッダーの他の部分を含めることもできます。

(2) 記事: このヘッダーのコアコンテンツを表す特別な独立したブロック

(3) 脇: タグの外側。コンテンツおよびタグ内容に関連する補助情報

(4) header: 特定のブロックのヘッダー情報/タイトル

(5) hgroup: ヘッダー情報/タイトルの補足内容) フッター: 下部の情報;

(7) nav: ナビゲーション バーの部分的な情報;

(8) 図: 写真とコンテンツを含む独立したユニット。

2. フォームラベル

(1) メールアドレスを入力する必要があります。

(2) URL アドレスを入力する必要があります。

(3) 番号:数値を入力する必要があります。

(4) range: 特定の範囲内の値を入力する必要があります。

(5) Date Pickers: 日付、月を選択します。 , year

b.month:月と年を選択

c.week:週と年を選択

d.time:時刻(時間と分)を選択

e. datetime: 時刻、日、月、年(UTC時間)を選択します

f.datetime-local: 時刻、日、月、年(現地時間)を選択します

(6) search: 通常のテキストフィールドを検索します;

(7) 色: 色。

3. メディアタグ

(1) video: ビデオ;

(2) audio: オーディオ

(3) embed: 埋め込みコンテンツ (さまざまなメディアを含む)、Midi、Wav 、AU、MP3、Flash、AIFFなど。

4. その他の機能ラベル (1) マーク: マーク、ハイライト (メモを取るためのハイライトのような)

(2) progress: ;

(3) time: データラベル、検索エンジンによって使用されます; リリース日 update date;

(4) ルビーとrt: とある一言コメント;コメント内容ブラウザが未対応の場合の表示方法;

(5) wbr : ソフト改行、ページ幅が必要な改行に達したときに改行します

(6) Canvas: 画像描画用のコンテンツを作成するために JS コードを使用します。ボタン;

(8) 詳細: メニューを展開します。

新しい属性:

js に追加された属性。

<スクリプト遅延 src=".....js" onload="alert('a')">

<スクリプト非同期 src="... ..js" onload="alert('b')">

上記2つの属性がない場合、実行順序は最初に最初のsrcをロード(ダウンロード)してから実行します。もう一方の onload は、h5 よりも前に同期的に実行されます。遅延ロード (遅延実行) を入力すると、まず src にファイルの内容がロード (ダウンロード) され、ページが表示されるのを待ちます。 js.async 属性は非同期読み込みに属し、src の読み込み直後に onload が実行され、上記の実行シーケンスでページの読み込みが継続されます。最初に b が表示されます。 a.

ウェブページのラベルに小さいアイコンのスタイルコードを追加します

順序付きリスト ol: 追加された start (リストの開始値)、reversed (反転されているかどうか) メニュー メニュー タイプ属性 (3 つのメニュー タイプ) 埋め込み CSS スタイル: ラベル内のスタイル ブロックを定義 (スコープ付き) )、styleタグ内でのみ有効です。iframe要素、シームレス、ボーダレス、srcdocがインラインフレームの内容を定義します。