意味論は、言語における単語やフレーズの意味を研究するものです。セマンティック要素 = 意味を持つ要素。 セマンティック要素は、ブラウザーと開発者にとってそれが何を意味するかを明確に説明します。 非セマンティック要素の例：<div>和<span>-それらの内容については何も知られていません。 セマンティック要素の例: <form>、<table>、<article> - コンテンツを明確に定義します。 最新のブラウザはすべて、HTML5 セマンティック要素をサポートしています。
多くの Web サイトには、ナビゲーション、ヘッダー、フッターを示す：<div id =nav> <div class =header> <div id =footer>などの HTML コードが含まれています。 HTML5 は、Web ページのさまざまな部分を定義するための新しいセマンティック要素を提供します。
<記事><余談><詳細><図キャプション><図><フッター><ヘッダー><メイン><マーク><ナビゲーション><セクション><概要><時間>HTML5の<section>要素
<section> 要素は、ドキュメントのセクションを定義します。 W3C の HTML5 ドキュメントによると、セクションはコンテンツをテーマごとにグループ化したもので、通常はタイトルが付いています。 ホームページは通常、紹介、コンテンツ、連絡先情報のいくつかのセクションに分割できます。
<!DOCTYPE html> <html> <body> <section> <h1>Java</h1> <p>Java は、クロスプラットフォーム、オブジェクト指向、およびエンタープライズに適用される汎用プログラミング機能を備えた、広く使用されているコンピュータ プログラミング言語です。 -レベルのWebアプリケーション開発とモバイルアプリケーション開発。 </p> </section> <section> <h1>PHP</h1> <p>PHP (正式名: PHP: Hypertext Preprocessor、すなわち PHP: Hypertext Preprocessor) は、オープンソースの汎用コンピュータ スクリプト言語です。 Web 開発に適しており、HTML に埋め込むことができます。 </p> </section> </body> </html>HTML5の<article>要素
<article> 要素は、独立した含まれるコンテンツを指定します。 記事はそれ自体で意味があり、Web サイトの他の部分から独立して読める必要があります。 <article> 要素が使用できる例:
<!DOCTYPE html> <html> <body> <article> <h1>Java</h1> <p>Java は、クロスプラットフォーム、オブジェクト指向、およびエンタープライズに適用される汎用プログラミング機能を備えた、広く使用されているコンピュータ プログラミング言語です。 -レベルのWebアプリケーション開発とモバイルアプリケーション開発。 </p> </article> </body> </html>HTML5の<header>要素
<header> 要素は、ファイルまたはセクションのヘッダーを指定します。 <header> 要素は、紹介コンテンツのコンテナとして使用する必要があります。 <header> には複数の要素を含めることができます。 次の例では、記事のタイトルを定義します。
<!DOCTYPE html> <html> <body> <article> <header> <h1>Java</h1> <p>Java とは:</p> </header> <p>Java は広く使用されているコンピュータですクロスプラットフォーム、オブジェクト指向、および汎用プログラミング機能を備えたプログラミング言語であり、エンタープライズ レベルの Web アプリケーション開発やモバイル アプリケーション開発で広く使用されています。 </p> </article> </body> </html>HTML5の<フッター>要素
<footer> 要素は、ファイルまたは部分的なフッターを指定します。 <footer> 要素には、その要素を含むユニットに関する情報が含まれている必要があります。 フッターには通常、ドキュメントの作成者、著作権情報、利用規約へのリンク、連絡先情報などが含まれます。 <footer> 内に複数の要素を含めることができます。
<!DOCTYPE html> <html> <body> <footer> <p>著作権</p> <p>連絡先情報: <a href=mailto:[email protected]> [email protected]</a> 。 </p> </footer> </body> </html>HTML5の<nav>要素
<nav> 要素は、一連のナビゲーション リンクを定義します。
<!DOCTYPE html> <html> <body> <nav> <a href=#>Java</a> <a href=#>CSS</a> | <a href=#>HTML</a> | <a href=#>jQuery</a> </nav> </body> </html>HTML5の<aside>要素
<aside> 要素は、配置されているコンテンツから一部のコンテンツ (サイドバーなど) を定義します。 <aside> コンテンツは周囲のコンテンツである必要があります。
<!DOCTYPE html> <html> <body> <p>Java は、クロスプラットフォーム、オブジェクト指向、汎用プログラミング機能を備えた、広く使用されているコンピュータ プログラミング言語であり、エンタープライズ レベルの Web アプリケーション開発やモバイル アプリケーションで広く使用されています。発達。 。 </p> <aside> <h4>PHP</h4> <p>PHP は世界で最高の言語です。 </p> </aside> </body> </html>要約する
上記はエディターによって紹介された HTML5 のセマンティック要素です。本当に正しく使用できましたか? ご質問があれば、メッセージを残してください。エディターがすぐに返信します。また、VeVb武道サイトを応援してくださった皆様、誠にありがとうございました！
この記事が役立つと思われる場合は、転載していただいてかまいませんので、出典を明記してください。ありがとうございます。