HTML5の新機能(1)_html5チュートリアルスキル-H5 チュートリアル-php.cn

ホームページ

ウェブフロントエンド

H5 チュートリアル

HTML5の新機能(1)_html5チュートリアルスキル

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

May 16, 2016 pm 03:45 PM

HTML5 は、1999 年に策定された HTML 4.01 および XHTML 1.0 標準に代わる HTML [1] (Standard Universal Markup Language に基づくアプリケーション) の標準バージョンであり、まだ開発段階にありますが、ほとんどのブラウザはすでにそれをサポートしています。特定の HTML5 テクノロジー。

1. 新しい文書型宣言
HTML4 で指定された 3 つの文書型宣言:

XML/HTML コードコンテンツをクリップボードにコピー

-//W3C//DTD HTML 4.01//EN”http://www.w3.org/TR/html4/strict.dtd” >
-//W3C//DTD HTML4.01//EN”http://www.w3.org/TR/html4/loose.dtd”>
-//W3C//DTD HTML4.01//EN” http://www.w3.org/TR/html4/frameset.dtd”>

XHTML 1.0 で指定された 3 つの文書型宣言:

XML/HTML コードコンテンツをクリップボードにコピー

-//W3C//DTD XHTML 1.0 Strict//EN” http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict 。 dtd”>
-//W3C//DTD XHTML 1.0 Transitional//EN” http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd” >
-//W3C//DTD XHTML 1.0 Frameset//EN” http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd” >

XHTML 1.1 ドキュメントでは厳密に型が定義されており、XHTML1.0 ドキュメントの暫定的な定義型と同等です

XML/HTML コードコンテンツをクリップボードにコピー

-//W3C//DTD XHTML 1.1//EN” http://www.w3.org/TR/xhtml11/DTD/xhtml1.dtd” >

HTML 5 の文書型宣言

XML/HTML コードコンテンツをクリップボードにコピー

/span>>

2. スクリプトにタイプを記述してリンクする必要はありません

XML/HTML コードコンテンツをクリップボードにコピー

link rel=”stylesheet” href=”path/to/stylesheet.css” type=”text/css” /> == 》 link rel=”スタイルシート” href=”path/to/stylesheet.css”/>
script src=”path/to/script.js” type=”text/javascript”>script> ; ==》スクリプト src=”パス/to/ script.js”>script>

3. 语义化ヘッダーとフッター标签
HTML4 または XHTML 里、我们定义网页の页眉または页脚時間会这样：

XML/HTML コード复制コンテンツ到剪贴板

div id=”header”>
…
div>
または
div id=”フッター” >
…
div>

一方、HTML5 には、上部要素ブロックの直接定義があり、コードをさらに追加することができます。

XML/HTML コード复制コンテンツ到剪贴板

ヘッダー>
…
ヘッダー>
または
フッター>
…
フッター>

4. hgroup チェックは、主にマークのセット を示します。メインマークやサブマークがある場合は、これを使用して下に含めることができます。
マーク分割されたシンボルを使用します。通常は文章の問題に適していますが、ウェブサイトの問題にはあまり適していません。

XML/HTML コード复制コンテンツ到剪贴板

h1>フロントエンドテストの質問: HTML5 の新機能h1>

span タグを使用して字幕の説明をマークします

XML/HTML コードコンテンツをクリップボードにコピー

h1>フロントエンドテストの質問
span>HTML5 の新機能スパン>
h1>

ヘッダータグを使用してタイトルと説明を囲みます

XML/HTML コードコンテンツをクリップボードにコピー

ヘッダー>
h1>フロントエンドテストの質問h1>
p>HTML5 の新機能p>
ヘッダー>

5. マーク要素マーク

XML/HTML コードコンテンツをクリップボードにコピー

mark> 要素は、マークまたはマークが付いた 1 つのドキュメント内の一連のテキストを表します。別のコンテキストでの関連性のため、参照目的で強調表示されています。

はハイライトタグとして使用でき、それに囲まれた文字が強調表示されます。 …
6. グラフィック要素図
HTML4 または XHTML では、画像のコメントを装飾するために次のコードが使用されます。。

XML/HTML コードコンテンツをクリップボードにコピー

img src=”パス/画像へのパス” alt=”画像について”/>
p>花の画像 p>

上記のコードはテキストと画像メモリを接続しませんが、HTML5 によって追加された Figure と figcaption の組み合わせにより、画像とテキストを完全に接続できます。

XML/HTML コードコンテンツをクリップボードにコピー

図>
img src=”パス/画像へのパス” alt=”画像について”/>
figcaption>
p>美しい花p>
figcaption>
図>

7. 小さなタグ
を再定義しました。HTML5 のタグは、宣言された機能、注意事項、法的制限またはバージョンを担当する小さなテキストとして表示されます。通常は小さなテキストです。
Small は HTML4 または XHTML で定義されていますが、その使用法についての完全な説明はありません。 HTML では、主に Web ページの下部にあるバージョン記述や電子メールアドレスなどの小さなテキストに使用されます。
8. プレースホルダー
HTML4 または XHTML で、入力ボックスが空のときにプロンプトメッセージを表示したい場合は、入力ボックスフィールドがフォーカスされます。プロンプトが消える効果は js でのみ記述できます。 HTML5 で追加されたプレースホルダーは、この効果を直接実現します。
プレースホルダー属性は、テキスト、検索、URL、電話、メール、パスワードのに適用されます。

XML/HTML コードコンテンツをクリップボードにコピー

入力プレースホルダー=”テキスト”>

声明

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

HTML5：標準とWeb開発への影響Apr 27, 2025 am 12:12 AM

HTML5のコア機能には、セマンティックタグ、マルチメディアサポート、オフラインストレージ、ローカルストレージ、フォームエンハンスメントが含まれます。 1。コードの読みやすさとSEO効果を改善するためのセマンティックタグなど。 2.ラベルでマルチメディアの埋め込みを簡素化します。 3。アプリケーションキャッシュやLocalStorageなどのオフラインストレージとローカルストレージは、ネットワークのない操作とデータストレージをサポートします。 4.フォームエンハンスメントでは、処理と検証を簡素化するための新しい入力タイプと検証プロパティを導入します。

H5コードの例：実用的なアプリケーションとチュートリアルApr 25, 2025 am 12:10 AM

H5は、さまざまな新機能と機能を提供し、フロントエンド開発の機能を大幅に向上させます。 1.マルチメディアサポート：メディアを埋め込んで要素を埋め込み、プラグインは必要ありません。 2。キャンバス：要素を使用して、2Dグラフィックとアニメーションを動的にレンダリングします。 3。ローカルストレージ：ユーザーエクスペリエンスを改善するために、ローカルストレージとセッションストレージを介して永続的なデータストレージを実装します。

H5とHTML5の接続：類似性と相違点Apr 24, 2025 am 12:01 AM

H5とHTML5は異なる概念です。HTML5は、新しい要素とAPIを含むHTMLのバージョンです。 H5は、HTML5に基づくモバイルアプリケーション開発フレームワークです。 HTML5はブラウザを介してコードを解析およびレンダリングしますが、H5アプリケーションはコンテナを実行し、JavaScriptを介してネイティブコードと対話する必要があります。

H5コードの構成要素：キー要素とその目的Apr 23, 2025 am 12:09 AM

HTML5の重要な要素には、最新のWebページの構築に使用される、、,,,,などが含まれます。 1.ヘッドコンテンツを定義します。2。リンクをナビゲートするために使用されます。3。独立した記事のコンテンツを表します。4。ページコンテンツを整理します。5。サイドバーコンテンツを表示します。

HTML5およびH5：一般的な使用法の理解Apr 22, 2025 am 12:01 AM

HTML5とHTML5の略語であるHTML5とH5の間に違いはありません。 1.HTML5はHTMLの5番目のバージョンであり、Webページのマルチメディア関数とインタラクティブ機能を強化します。 2.H5は、HTML5ベースのモバイルWebページまたはアプリケーションを参照するためによく使用され、さまざまなモバイルデバイスに適しています。

HTML5：現代のウェブのビルディングブロック（H5）Apr 21, 2025 am 12:05 AM

HTML5は、W3Cによって標準化されたHyperText Markup言語の最新バージョンです。 HTML5は、新しいセマンティックタグ、マルチメディアサポート、フォームの強化、Web構造の改善、ユーザーエクスペリエンス、SEO効果を導入します。 HTML5は、Webページ構造をより明確にし、SEO効果をより良くするために、、、、、、などの新しいセマンティックタグを導入します。 HTML5はマルチメディア要素をサポートしており、サードパーティのプラグインは不要で、ユーザーエクスペリエンスと読み込み速度が向上します。 HTML5はフォーム関数を強化し、ユーザーエクスペリエンスを向上させ、フォーム検証効率を向上させるなどの新しい入力タイプを導入します。

H5コード：クリーンで効率的なHTML5の書き込みApr 20, 2025 am 12:06 AM

クリーンで効率的なHTML5コードを書き込む方法は？答えは、タグのセマンティック、構造化されたコード、パフォーマンスの最適化、一般的な間違いを回避することにより、一般的な間違いを避けることです。 1.コードの読みやすさとSEO効果を改善するには、セマンティックタグなどを使用します。 2。適切なインデントとコメントを使用して、コードを構造化して読みやすいままにします。 3.不必要なタグを減らし、CDNを使用してコードを圧縮することにより、パフォーマンスを最適化します。 4.タグが閉じていないなどの一般的な間違いを避け、コードの有効性を確認してください。

H5：ウェブ上のユーザーエクスペリエンスをどのように強化するかApr 19, 2025 am 12:08 AM

H5は、マルチメディアサポート、オフラインストレージ、パフォーマンスの最適化により、Webユーザーエクスペリエンスを向上させます。 1）マルチメディアサポート：H5と要素は、開発を簡素化し、ユーザーエクスペリエンスを向上させます。 2）オフラインストレージ：WebStorageとIndexEdDBは、エクスペリエンスを改善するためにオフラインで使用できるようにします。 3）パフォーマンスの最適化：ウェブワーカーと要素は、パフォーマンスを最適化して帯域幅の消費を削減します。

See all articles