Daily Archives: 2015年5月9日

HTMLの基本構造について

Published by:

さて,先回例として示したのは以下のソースコードでした。

<html>

<head>

<title>見出し</title>

</head>

<body>

こんにちは!

</body>

</html>

タグがいくつか登場しています。

Webで表示されるHTMLファイルは基本的に要素の寄せ集めで構成されます。

タグはその要素が何なのかの荷札や付箋の役割を果たしましたね。

html要素:

<html>から</html>までがWebの標準的な言語であるhtmlという言語形式で記述しているという事を明示する荷札(タグ)という事になります。

そして,HTMLファイルは大きく分けると頭(head)と体(body)で構成されます。

なので最も基本的なHTMLファイルは,

<html>

<head>

</head>

<body>

</body>

</html>

となります。改行は必要ありませんが,見やすくするためにタグ毎に改行させています。

 

head要素:

<head>から</head>まではhead部分になります。

headタグの間に色々と記述が可能なのですが,代表的なものがtitle要素でブラウザの見出しに表示する内容です。

<title>から</title>で挟まれた部分(title要素の内容)をブラウザの見出しにしますよという事を示しています。

test.htmlをブラウザで表示させるとwindowのバーに「見出し」と表示されていたのにお気づきでしたか?

 

body要素:

<body>から</body>までがブラウザに実際に表示させたい内容になります。

test.htmlでは「こんにちは!」と表示されたはずです。

 

どうですか。意外に簡単だと感じるのではないでしょうか。

<body>から</body>の間に表示させたいものを記載する事で希望のWebサイトを構築できます。

 

試しに何でもいいのでhtmlファイルを作成してブラウザで表示させてみて下さい。

きっと,思った通りの表示にならない事でしょう。

理由は次回に。

 

今日のまとめ

htmlファイルの基本構造

<html>

<head>

</head>

<body>

</body>

</html>