简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
ホームページ > ウェブフロントエンド > H5 チュートリアル > 本文

html5の基本タグ（html5ビデオタグ・html5新タグの使い方）_html5チュートリアルスキル

WBOY
リリース： 2016-05-16 15:48:25
オリジナル
2162 人が閲覧しました

1. 宣言の変更

2. 文字エンコーディングの変更を指定します

html5ではutf-8

を使用することを推奨します

3. HTML5 ではターミネータなしで

を使用できますが、これはエラーではありません

4. 終了タグは記述できません: area、base、br、col、command、embed、hr、img、input、keygen、link、meta、param、source、track、wbr

5. 終了タグを省略できる要素は、li、dt、dd、p、rt、rp、optgroup、option、colgroup、thead、tbody、tfoot、tr、td、th

6. すべてのタグを省略できる要素: html、head、body、colgroup、tbody

7. 以前は、属性値のテキストには二重引用符が必要でしたが、省略できるようになりました。

8. html5 マークアップの例を参照してください

9. 新しい構造要素セクション: コンテナー要素。章、ヘッダー、およびフッターを h1、h2... と組み合わせて使用​​して、文書の構造を示すことができます。タイトル コンテンツをカプセル化するために使用することもできますが、不適切なタイトルはありません。コンテナ要素を直接スタイル設定またはスクリプト化して動作を定義する必要がある場合は、section の代わりに div を使用することをお勧めします。機能: ページのコンテンツをチャンクに分割します。独自の完全な独立したコンテンツを持つarticle要素と混同しないでください。要約: ① スタイルを設定するためのページコンテナとしてセクション要素を使用しないでください。これは div 要素の役割です。 ②article要素、side要素、nav要素の方が適している場合は、section要素を使用しないでください。 ③タイトルのないコンテンツブロックにはsection要素を使用しないでください。

10. 新しい構造要素の記事: ブロックレベルの要素。文脈的に関連性のない、ページ上の独立したコンテンツの一部を表します。独立性を強調し、セクションは分割またはチャンク化を強調し、記事は独立性を強調します。

11. 新しい構造要素は別として: ブロックレベル要素。 Article要素のコンテンツ位置と、article要素のコンテンツに関連する補助コンテンツを表します。

12. 新しい構造要素ヘッダー: ブロックレベルの要素。ページ全体のタイトル。ヘッダーには、少なくとも 1 つの見出し (h1 ～ h6)、hgroup 要素、または nav 要素が必要です。

13. 新しい構造要素 hgroup: ブロックレベルの要素。ページ全体またはページ内のコンテンツ ブロックのタイトルを結合するために使用されます。メインタイトルが 1 つだけの場合、hgroup は必要ありません。

14. 新しい構造要素フッター: ブロックレベル要素。コンテンツブロックのフッター。

15. 新しい構造要素アドレス: インライン要素。著者、電子メールなどを含む文書の連絡先情報を提示します。

16. 新しい構造要素 nav: ブロックレベルの要素。ナビゲーションリンク。従来のナビゲーション、サイドバー ナビゲーション、ページ内ナビゲーション、ページめくりナビゲーション。 H5 では nav の代わりに menu を使用しないでください。menu 要素はコマンドを発行する一連のメニューです。これは対話型要素です。より正確には、Web アプリケーションで使用されます。

17. 新しい構造要素図: ブロックレベル要素。ストリーム コンテンツの独立した部分は、通常、ドキュメント主題のストリーム コンテンツの独立した単位を表します。 figcaption 要素を使用して、Figure 要素のグループにキャプションを追加します。

18. 新しい要素ビデオ: ビデオを定義します。

コードをコピーします
コードは次のとおりです:

19. 新しい要素 audio: オーディオを定義します。

コードをコピーします
コードは次のとおりです:

20. 新しい要素の埋め込み: さまざまなメディアを挿入します。形式は、midi、wav、aiff、au、mp3 などです。

21

コードをコピーします
コードは次のとおりです。

< object width= "320" height="240" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6 ,0, 40,0"> name="src" value=""borse.wav"/" />

22. 新しい要素マーク: 強調表示または強調表示されたテキスト。スパン

によく似ています

23. 新しい要素の進行状況: 実行中のプロセスを表し、時間のかかる関数のプロセスを JavaScript で表示します。

コードをコピーします
コードは次のとおりです:


24. 新しい要素 Time: 日付と時刻を表します。


コードをコピーコードは次のとおりです。

Span

はH4で使用されます。 25. 新しい要素ruby: ルビのコメントを表します。ハンハン、h4では利用できません

26. 新しい要素 rt: 文字の解釈または発音を表します

27. 新しい要素 rp: Ruby 要素をサポートしていないブラウザで表示されるコンテンツを定義するために Ruby で使用されます。

28. 新しい要素 wbr: ソフト改行を表します。 br との違いは、br はここで改行を実行する必要があることを意味し、一方、wbr はブラウザまたは親要素の幅が十分な場合、幅が十分でない場合は行の折り返しは実行されないことを意味します。ここで行が自動的に折り返されます。 Wbr は文字ベースの言語には非常に便利ですが、中国語にはあまり効果がないようです。 H4 では使用できません。

29. 新しい要素 Canvas: グラフィックを表します。例: グラフ、画像。ただし、要素自体には動作がありません。キャンバスのみが提供され、描画 API がクライアント JavaScript に表示されるため、スクリプトはこのキャンバスに描画を行うことができます。


コードをコピーコードは次のとおりです:


30. 新しい要素コマンド: コマンド ボタンを表します。ラジオ ボタン、チェック ボックス、ボタンなど。



コードをコピーコードは次のとおりです:


html4 には

がありません

31. 新しい要素の詳細: 詳細ユーザーが必要とし、取得できる詳細情報を示します。概要と組み合わせて使用​​できます。概要にはタイトルまたは凡例が含まれます。


コードをコピーしますコードは次のとおりです。
<詳細< summary>html5


32. 新しい要素 datagrid: データのリストを表します。 。ツリーリストで表示
33. 新しい要素 keygen: キーの生成を示します

34. 新しい要素の出力: さまざまなタイプの出力を表します。スクリプトなど

35. 新しい要素のソース: メディア要素。メディア資産を定義します。 H4 で param

を使用する

36. 新しい要素 menu: メニューリストを表します。



コードをコピー

コードは次のとおりです。< li>


h4 でのメニューの使用は推奨されません。

37. 新しい入力要素タイプ 電子メール: 電子メールを入力する必要があるテキスト入力ボックスを示します。

38. 新しい入力要素タイプ url: URL アドレスを入力する必要があることを示します

39. 新しい入力要素タイプ番号: 数値を入力する必要があることを示します。

40. 新しい入力要素の種類の範囲: 特定の範囲内の数値を入力する必要があることを示します

41. 新しい入力要素タイプの日付ピッカー: h5 には日付と時刻を選択できる複数の新しい入力テキスト ボックスがあります。


コードをコピーコードは次のとおりです:
日付----- --- ------日、月、年を選択
月----------月、年を選択
週-----------週と年を選択
時間----------時間 (時と分) を選択
日付時刻------時間、日、月、年を選択 (UTC 時間) )
Datetime-local - 時刻、日、月、年 (現地時間) を選択します


44.

1) 要素の廃止: 一部のブラウザのみがサポートする要素: アプレット、bgsound (IE でのみサポート)、blink、marquee などの要素。 bgsound (ie のみサポート)、marquee (ie のみサポート) のため、h5 では廃止されました。アプレット - 埋め込みまたはオブジェクトに置き換えることができます。 Bgsound — オーディオに置き換えることができます。 Marquee は js プログラミングで置き換えることができます。

2) タグ手動定義: 要素を結合するために使用されます。 使用ガイド: 主に画像と画像の説明を組み合わせるために使用されます:



コードをコピーしますコードは次のとおりです:


図ラベル
ここに説明があります画像情報



3) ラベルマニュアルの説明: メニューリストを定義します。フォーム コントロールをリストする場合は、このラベルを使用します。 使用ガイド: メニュー リストまたはメニュー オプションを定義するためにメニュー ブロックで使用されます:

コードをコピー
コードは次のとおりです。



  • HTML 5

  • CSS

    • < ;li>JavaScript
    前の記事：複数ファイルアップロードのHTML5実装サンプルコード_html5チュートリアルスキル 次の記事：HTML5 チュートリアルの四角形の描画コード共有_html5 チュートリアルのスキル
    このウェブサイトの声明
    この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
    著者別の最新記事
    最新の問題
    SQL Count() にも 0 が必要です テーブルが 1 つだけあり、0 で始まるタグの各エントリをカウントしたいと考えています。今度はこれを試します: SELECT tag,COUNT(start)ASAnzahl,us...
    から 2024-04-06 19:48:53
    0
    1
    449
    hr タグが単色白に設定されているのに半透明になるのはなぜですか? HTML（ブートストラップ付き）とCSSがあり、HTMLにはクラスを持つ<hr>タグがあり、CSSにはその境界線スタイルがあります。半透明で白い色は見えますが、「固体」...
    から 2024-04-06 16:13:26
    0
    1
    500
    ベンダー固有の疑似要素上の JavaScript ホバー イベント 次の htmlinput タグがあります。 $("input[type='range']::-webkit-slider-thumb").on('hover',...
    から 2024-04-06 15:35:24
    0
    1
    274
    ページのメインディスプレイに画像を表示するにはどうすればよいですか? 私がやりたいのは、NASAAPI を使用して写真を受信することです。これらの写真は、マイページのサムネイルとメインディスプレイに表示されます。コードがサムネイルから画像を取得してペ...
    から 2024-04-06 15:33:12
    0
    1
    433
    固定配置された子によって親のパディングが無視される スティッキー要素がヘッダーの後ろに来るのを防ぐにはどうすればよいですか?現在のコードスニペットは親にpadding-topを使用しており、追加の子にmargin-topまたは透明な...
    から 2024-04-06 11:42:51
    0
    1
    338
    関連トピック
    詳細>
    人気のおすすめ
    人気のチュートリアル
    詳細>
    関連するチュートリアル
    人気のおすすめ
    最新のコース
    最新のダウンロード
    詳細>
    ウェブエフェクト
    公式サイト
    サイト素材
    フロントエンドテンプレート
    私たちについて 免責事項 Sitemap
    PHP中国語ウェブサイト：福祉オンライン PHP トレーニング，PHP 学習者の迅速な成長を支援します！