Webサイトを構築するときは、複数のWebページが必要になる場合があります。 追加のページを追加してリンクする場合は、最初に新しいページを作成する必要があります html Webサイトのプロジェクトディレクトリにあるファイル。 このチュートリアルでは、Webサイトに追加のWebページを作成してリンクする方法を学習します。

デモンストレーションWebサイトには、「About」Webページが含まれています。 このチュートリアルでは、「About」Webページを作成してリンクするプロセスについて説明しますが、必要に応じてこのページのタイトルとコンテンツを変更できます。

Webサイトに新しいページを追加するには、という名前の新しいファイルを作成します about.html プロジェクトディレクトリに保存します html-practice. （チュートリアルシリーズに従わなかった場合は、新しいを設定するための手順を確認できます html チュートリアルのファイルHTMLプロジェクトの設定。）

注：ファイルに独自の名前を選択する場合は、文字スペース、特殊文字（！、＃、％など）、および大文字を使用しないでください。これらは問題を引き起こす可能性があります。後で。 また、 .html 拡大。

次に、ブラウザがファイルの内容を解釈するのに役立つ情報を追加して、ファイルをフォーマットする必要があります。 ファイルをフォーマットするには、ドキュメントの上部に次のコードスニペットを追加します。

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>About</title>
  </head>
</html>

強調表示されたテキストを、ページに必要なタイトルに変更してください。 各HTMLタグの説明については、このシリーズの以前のチュートリアルにアクセスしてください。 HTMLの追加あなたのウェブページへの要素 。 続行する前にファイルを保存してください。

このページにコンテンツを追加する前に、ホームページにこのページへのリンクを追加する手順を見ていきましょう。

まず、あなたに戻ります index.html ファイルを作成し、サイトのサブタイトルの下とクロージングの上に次のスニペットを追加します </div> 鬼ごっこ：

...
<p style="font-size: 20px; color:#1F9AFE;">
<a href="Webpage_FilePath">About this site</a>
</p>
...

強調表示されたファイルパスを「about.html」ファイルのrelativeファイルパスに変更します。 相対パスは、現在の作業ディレクトリを基準にしたファイルの場所を参照します（ルートディレクトリを基準にしたファイルの場所を参照する Absolute パスとは対照的です）。VisualStudioコードテキストを使用している場合エディター、相対ファイルパスをコピーすることができます CTRL + Left Click （Macの場合）または right-clicking' (on Windows) on the file icon and selecting 相対パスをコピーします。`

フォントサイズと色も指定していることに注意してください。 style 属性。 あなたの index.html ファイルを作成し、ブラウザにリロードします。

これで、 about.html このようなウェブページ：

エラーが発生した場合は、ファイルがと同じプロジェクトディレクトリにあることを確認してください index.html ファイルであり、プロジェクトパスにエラーがないこと。

これで、Webサイトに新しいWebページを作成してリンクする方法を理解する必要があります。 これらの同じ手順を使用して、Webサイト上の追加のWebページを作成してリンクすることができます。 ホームページにコンテンツを追加する方法を学習しているのと同じ方法で、新しいWebページにコンテンツを追加することもできます。