ホームページ > 記事 > ウェブフロントエンド > HTML5 の新しいタグと属性の概要
この記事では、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がインラインフレームの内容を定義します。
マニフェスト属性:
ページが使用する必要があるオフライン アプリケーション ファイルを定義します。通常は タグ内に配置されます
charset 属性:
ページの文字セットを定義するメタ属性の 1 つ
追加時に新しい属性 リンクの rel="icon" がアイコン サイズの設定に使用される場合
base 属性:
defer 属性:
script タグ属性。これは、スクリプトがロードされた後に、ページも読み込まれた場合にのみ実行されます (遅延実行)
async 属性:
script タグ属性。スクリプトが読み込まれた直後に実行されます (ブラウザは操作中に次のコンテンツを解析します)。ページがまだロードされていない場合でも (非同期実行)
media 属性:
hreflang 属性:
< a> 属性、ハイパーリンクが指す URL で使用される言語を示します
ref 属性: ハイパーリンクが外部リンクであるかどうかを定義する
の属性: シリアル番号がフラッシュバックであるかどうかを定義する
の属性
start 属性: シリアル番号の開始値を定義する
スコープ属性:
埋め込まれた CSS スタイルの属性。このスタイルの定義は、単一ページ上で適用可能です。
HTML5 グローバル属性: に使用できます。任意のタグ、次の 6 つの
data-yourvalue、hidden、Spenllecheck、tabindex、contenteditable、desginMode;
タグに直接挿入できます: data-custom 属性名前。 hidden (非表示にするために直接配置します);
spellcheck="true" (文法修正);
tabindex="1" (タブジャンプ順序);
contenteditable="true" (編集可能な状態、コンテンツをクリックして変更可能);
2. JavaScript に window.document.designMode = 'on' を挿入します (JavaScript のグローバル プロパティで、ページ全体のテキストを編集できます)。
関連する推奨事項:
以上がHTML5 の新しいタグと属性の概要の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。