リンクの設定

日　時：2022年11月23日 13:30から16:00

参加者：小野 寺島 大関 大野 青木 池田 藤本

内　容：フォルダー構造を整え、下の階層のページへリンク、上の階層のページへリンク及び同じ階層のページへリンクを学習した。
1つ下の階層のファイルへのリンクは次のように記述します。
<a href="フォルダー名/ファイル名">テキスト</a>
1つ上の階層のファイルへのリンクは次のように記述します。
<a href="../ファイル名">テキスト</a>
同じ階層のファイルへのリンクは次のように記述します。
<a href="ファイル名">テキスト</a>

実習

1. 勉強会用フォルダー内に「image」「style」及び「text」フォルダーを作成し、「image」内に画像ファイルを「style」内にCSSファイルを「text」内にHTMLファイルを移した。

   

2. 勉強会のフォルダーからVSCodeを開き下記を入力しフォルダ直下にファイル名「index.html」として保存しました。

   

3. 同様にして下記を入力し「text」フォルダーにファイル名「park.html」として保存しました。

   

4. 1つ下の階層のファイルへのリンクの例として「index.html」から「zoo.html」及び「park.html」へのリンクを設定しました。

   

5. 「zoo.html」及び「park.html」間の相互リンク（同じ階層間）と「zoo.html」及び「park.html」から「index.html」へのリンク（上の階層へ）を設定しました。
   zoo.html
   

   

   park.html