[HTML] HTMLタグ構造

Study / Javascript, Jquery, Css 作成日付 : 2019/11/22 19:49:41 修正日付 : 2019/11/22 19:49:41

こんにちは。明月です。

ウェブサービスで構成するものは大幅で「Html」と「Javascript」、「CSS Style」があります。

その中で「Html」はXml形式でドキュメントの構造を担当しているし、「CSS Style」はUIデザインスタイルを担当しています。「Javascript」の場合はウェブドキュメントを動的に動くようにスクリプトの領域です。

先に「Html」の構造に関して調べましょう。

「Html」はXml形式を継承したので、基本はタグが開くと閉める構造になっています。

「<タグ></タグ>」の構造ですね。閉めるタグには「/」記号を入れて表示します。

基本構造は初めドキュメントタイプ宣言してhtmlタグから始まります。

htmlタグはheadタグとbodyタグが必須にあるし、headタグはtitleタグが必須にあります。

<!DOCTYPE html>
<html>
  <head>
    <title></title>
  </head>
  <body>
  </body>
</html>

上の構造になっています。headのタグはtitleやメタタグ、style宣言、script宣言などがあります。bodyタグは実際にブラウザから見えるデータタグがあります。

タグ	説明
html	HTMLタグの最上位タグです。(必須)
head	HTMLの下位タグでheadではタイトル、メタ情報があります。
body	HTMLの下位タグでHTMLのドキュメント情報があります。
meta	headの下位タグでドキュメントのメタ情報があります。メタ情報はドキュメントエンコーディング情報、キーワード、検索サイトの制御設定、外部リンク情報があります。
title	headの下位タグでHTMLドキュメントのタイトルで宣言するし、ブラウザのタイトルで表示します。
link	headの下位タグでライブラリなどをリンクします。
header	bodyの下位タグでドキュメントの上端部分を作成します。
main	bodyの下位タグでとキュメンとのメインコンテンツを作成します。
article	bodyの下位タグで独立的なコンテンツを作成します。
session	bodyの下位タグでコンテンツのセッションを区分します。
nav	bodyの下位タグでドキュメントのナビを作成します。
aside	bodyの下位タグでmainタグのメインコンテンツと情報を分離します。
footer	bodyの下位タグでドキュメントの下端部分を作成します。