HTML

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要素に入れる

ABOUT ME
みいと
みいと
興味を持ったものをいろいろと勉強しています。
記事URLをコピーしました