HTMLの基本要素まとめ
HTMLの基本要素
今回は前回の記事でも例に出したHTMLの基本構造のまとめです。
<!DOCTYPE html>
<html lang="ja">
<head>
<title>ページのタイトル</title>
</head>
<body>
ブラウザに表示する内容
</body>
</html>
DOCTYPE宣言
1番最初に出てくる<!DOCTYPE html>はDOCTYPE宣言と呼ばれるもので、このHTML文書をどのバージョンで書くかという宣言となります。
この例の<!DOCTYPE html>はHTML5を宣言しています。
私の場合はHTML5を勉強しているのでいつも<!DOCTYPE html>を使っています。
html要素
html要素がHTML文書の開始と終了を表していて、すべての要素はHTMLタグの中に記述します。
また、htmlタグにはlang属性というもので、文書内で使用されている言語を設定するのがいいようです。
使用する言語が日本語なら下記のように記述します。
<html lang="ja">
属性はタグに対しての設定のようなものです。
下記のように開始タグのタグ名の後に半角スペースを空けて 属性名=”属性値” の形式で設定します。
<タグ名 属性名=”属性値”>
さらに半角スペースを空けて複数の属性を設定することもできます。
head要素
head要素はメタデータコンテンツを入れるための要素です。
簡単に言うとHTML文書自身に関する情報を入れる場所でブラウザには表示されません。
title要素
title要素はHTML文書のタイトルを入れるための要素で、head要素の中で使用します。
title要素の内容はブラウザの一番上のタブの部分に表示されたり、ブックマークするときにデフォルトの文言として使われたりします。
title要素はHTML文書のタイトルになるので1つのHTMLファイルの中で1つしか使うことができません。
body要素
body要素はブラウザに表示させるコンテンツを入れるための要素です。
文章を記述したり、画像を表示させたり、リンクを張ったりとbody要素の中にはいろいろな要素が入ることになります。
HTMLの基本要素のまとめ
では最後にHTMLの基本要素のまとめです。
- まずは文書をどのバージョンで書くのかをDOCTYPEで宣言する
- 全ての要素はhtml要素の中に記述する
- head要素には文書に関する情報を入れる
- title要素は文書のタイトル設定でhead要素の中に1つだけ使用する
- ブラウザに表示させる内容はbody要素に入れる