HTML&CSS

【HTML】基本構造

【HTML】基本構造

HTMLファイルは、決められた基本構造を記述していく必要があります。

HTMLの基本構造は<head>要素と<body>要素が必要で、<html>要素の中の<head>要素にはページに関する情報、<body>要素には実際に表示したい内容を記述していきます。

 html
<!DOCTIPE html>
<html>
	<head>
	</head>
	<body>
		<h1>HTMLの基本構造とは</h1>
		<p>HTMLの基本構造はhtml、head、bodyで構成されています。</p>
	</body>
</html>

また、上記の<!DOCTYPE html>の部分はDOCTYPE宣言と呼ばれるもので、HTMLのバージョンを宣言するためのものです。

今回は最新バージョンのHTML5を使うため、<!DOCTYPE html>を使用しますが、難しく考えずに「必ず記述するもの」と覚えても問題ありません。

<head>要素

<head>要素にはWebページの設定に関する情報を書いていきます。

<head>要素内に記述した内容はWebページには表示されませんが、<head>要素には必ず入れる3つの要素があります。

ポイント

  • 文字コードの指定
  • ページのタイトルの設定
  • CSSの読み込み

<head>要素の中では、上記のように「文字コードの指定」、「ページのタイトルの設定」、「CSSの読み込み」などを行っていきます。

 html
	<head>
		<meta charset="uft-8">
		<title>プログラミング学習</title>
		<link rel="stylesheet" herf="stylesheet.css">
	</head>

文字コードを指定

文字コードを指定することで、WEBページの文字化けを防ぐことができます。

<meta charset="●●●">とすることで、「●●●」で指定したの文字コードを適用することができます。

一般的に「HTML5」で推奨されている文字コードは「UTF-8」です。

WEBページのタイトル

<title>要素は、ページのタイトルを指定します。

<title>要素で指定されたタイトルはブラウザのタブ上に現れ、Google検索などの検索エンジンの検索結果にも影響を与えます。

CSSの読み込み

HTMLで「CSS」を適用する場合は、はHTMLの方で読み込む必要があります。

HTMLからCSSを読み込むためには、<link rel="stylesheet">を使用し、<link rel="stylesheet" href="stylesheet.css">のように、href属性で読み込むCSSファイルを指定します。







-HTML&CSS

© 2021 Issy9174 official web site