基本
HTML5ではタグの種類によっては終了タグを省略出来る。
しかし初心者の間はつけて学習したほうが無難。
(省略するには直後に、空行、コメントがあったらNG、などルールがタグ毎に違う)
ひな形
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>サイトのタイトル</title>
<meta name="description" content="サイトの概要">
<meta name="keywords" content="キーワードA,キーワードB">
</head>
<body>
<!-- ヘッダー -->
<header></header>
<!-- 本文 -->
<div id="wrap"></div>
<!-- フッター -->
<footer></footer>
</body>
</html>
DOCTYPE宣言
どのバージョンのHTMLで作成されているかを明示するのがDOCTYPE宣言
現在の主流はHTML5(2018/01/18)
HTML5
<!DOCTYPE html>
HTML4(Strict)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
HTML4(Transitional)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
XHTML 1.0(Strict)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
XHTML 1.0(Transitional)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html> </html>
HTML文書の最上位の要素。
DOCTYPE宣言の下に記述する。
lang属性に文書の言語コードを記述する。(ja=日本語)
<html lang="ja">
html要素の中に<head>、<body>が内包される
<id>と<class>
<id>は要素に対して固有の名前を割り当てる
<class>は要素に対して分類を割り当てる。
<id>
- 同ページ内でidが被ってはいけない
- CSSで直接指定で装飾が出来る。(影響範囲がハッキリしている)
- ページ内リンク(ジャンプ)として使用できる
<class>
- 複数の要素で共通のclass名を使える
- CSSで同じclass属性に対して一括で装飾が出来る
- ひとつの要素に複数のクラス属性をつけられる(半角スペースで区切る)
- オブジェクト思考言語のclassとは関係がない。idのグループ版と思えば良い。