などビデオとオーディオ
<video width="640" height="320" preload="auto" poster="0.jpg" controls>
<source src="movie.ogg" type="video/ogg" />
<source src="movie.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
フォームの拡張
新しい入力タイプ:色、電子メール、日付、月、週、時間、日時、ローカル日時、数値、範囲、検索、電話番号、URL新しい属性: require
d、オートフォーカス、パターン、リスト、オートコンプリート、プレースホルダー新規要素: 、
canvas タグは 2D グラフィックを描画します。
var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
context.beginPath();
context.moveTo(100,100);
context.lineTo(300,300);
context.lineTo(100,500);
context.lineWidth = 5;
context.strokeStyle = "red";
context.stroke();
位置情報の取得HTMLセマンティクス
1. HTMLセマンティクスとは何ですか?
タグを通じてコンテンツのセマンティクスを決定します。たとえば、h1 タグに基づいてコンテンツがタイトルであるかどうかを決定し、 に基づいてコンテンツが段落であるかを決定します。入力ボックスなど
2. なぜセマンティクスなのか?
1) スタイルが削除または失われた場合、ページは明確な構造を提示できます2) 他のデバイス (スクリーン リーダー、ブラインド リーダー、モバイル デバイスなど) が Web ページをレンダリングするのに便利です。意味のある方法3) . SEO に役立ちます
4)。W3C 標準に準拠しており、タグが意味的に適切かどうかを判断する方法は?
スタイルを削除して、Web ページの構造がよく整理され、整然としているかどうか、また非常に読みやすいかどうかを確認します。
4. 共通のセマンティック ラベル モジュール
フォーム <form action="" method="">
<fieldset style="border: none">
<legend style="display: none">登录表单</legend>
<p><label for="name">账号:</label><input type="text" id="name"></p>
<p><label for="pw">密码:</label><input type="password" id="pw"></p>
<input type="submit" name="登录" class="subBtn">
</fieldset>
</form>
フォーム フィールドは、fieldset タグでラップする必要があり、各
input タグ に対応する説明テキストを説明するために使用する必要があります。 label タグを作成し、入力の id 属性を設定し、label タグで for=someld を設定することで、説明テキストを対応する入力に関連付けます。
5. セマンティックタグで注意すべきいくつかの問題
非セマンティックタグ p と spam はできるだけ少なく使用してください
セマンティックが明らかでない場合は、p または p を使用してください。デフォルトでは、上部と下部にスペースがあり、特別な端末との互換性にとって有益です。
b、font、u などの純粋なスタイル タグを使用せず、代わりに CSS 設定を使用してください。 強調する必要があるテキストは、strong タグまたは em タグに含めることができます。strong のデフォルトのスタイルは太字 (b を使用しない)、em は斜体 (i を使用しない) です
この記事の事例を読んで方法をマスターしました。さらにエキサイティングな内容については、php 中国語 Web サイトの他の関連記事に注目してください。
推奨読書:
HTML5 で画像を回転させるアニメーション効果を実現する方法
H5 ビデオで BGM を自動的に再生する方法
🎜🎜以上がH5 セマンティック タグの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。