Hyper Text Markup Language
HTML｜HTML/Tags｜HTML/Sample｜HTML/Tips
はじめに
HyperText Markup Language（ハイパーテキスト マークアップ ランゲージ）とは、ウェブ文書を記述するためのマークアップ言語で、文章や画像はもちろん、リスト表記や表組み、他のドキュメントへのハイパーリンクも設定できます。
HTMLファイルは、ごく普通のテキストファイル（文字が並んだだけのもの）なので、テキストエディタ（メモ帳のようなもの）で書いて、保存するだけで完成します。
MENU
HTMLの基本構造
ひとつのHTMLファイル、すなわちひとつのWebページは、
おおよそ以下のような構造のソースコードで記述されています。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset = "UTF-8">
<title>Sample Page</title>
</head>
<body>
<h1>見出し</h1>
<p>
本文
</p>
</body>
</html>
＜!DOCTYPE html＞
ドキュメントタイプ宣言。標準準拠モード(Standard Mode)のHTML5文書であることを意味します。
＜html＞ ～ ＜/html＞
HTML文書の最上位階層(ルート)要素です。ページ全体は<html>に始まって、</html>で終ります。開始タグには上の例のように主要言語を lang 属性で記述します。この情報は音声ツールや翻訳ツール等に利用されます。
この中に head と body の２つが入りますが、head も body も、かならず一つずつ。また、その隙間に何かを書いてはいけません。
＜head＞ ～ ＜/head＞
ページに関する付加情報(メタデータ)を記述する部分です。ページのエンコード、キーワード等を示す meta、ページタイトルを示す title などが入ります。この部分は、デフォルトのスタイルシートで display: none; となっているため、画面上には表示されません。
＜body＞ ～ ＜/body＞
ページのコンテンツです。ブラウザに表示されるすべての要素がこの中に記述されます。
タグと属性
開始タグと終了タグ
HTMLの記述では、文章（文字列）要素を「開始タグ」と「終了タグ」で囲むかたちで構造上の地位を与えます。
<要素名>文章</要素名>
参考：HTML5で閉じタグを書かないもの一覧
br,img,hr,meta,input,embed,area,base,col,keygen,link,param,source
属性情報
タグには、属性情報（複数可）を与えることができます。
<要素名 属性名 =値 属性名 =値 ・・>文章</要素名>
グローバル属性
属性はタグによって使えるものが異なりますが、すべての要素に共通に使うことができるグローバル属性というものがあります。以下、主なものです。
id ="名前"
ページ上で唯一の要素にを指す固有名で、CSSのセレクタになります。
id名は、以下のようにしてページ内リンクに使うことができます。
<div id="pageTop"> </div>
:
<a href="#pageTop">ページの先頭へ</a>
class ="名前"
ページ上で複数の要素に適用できる分類名で、CSSのセレクタになります。半角スペースで区切ることで、複数のclass指定ができるます。
style ="スタイル記述"
CSSを直接書き込む場合に使用 例：<p style="color:red;">文章</p>
title ="表題"
表題や説明フレーズが入ります
lang ="言語コード"
日本語のページであれば、言語コードは ja 例：＜html lang="ja"＞
HTMLタグ
ページを独立させました ＞ HTML/Tags