我が街ページの作成

準備

1. 我が街ページから、ヘッダー画像及び写真８枚を取得し「img」フォルダーに保存します。
2. エクスプローラーを開きtextフォルダーの「photogallery.html」をコピーして、ファイル名を「wagamati.html」に変更します。

Bracketsの起動とファイルの起動

1. Bracketsの起動し、ファイルから「フォルダーを開く」をクリックし、準備で作成した「講習会」選択します。
2. 「wagamati.html」を選択します。

テキストの書き換え

1. 「main」要素のh1要素を「わが街のページへようこそ！」に書き換えます。
2. 次のp要素を「普段何気なく見過ごしていたことでも、改めて気が付いて驚くことがあります。そんなあれこれのスナップ写真を紹介します。」に書き換えます。
3. クラスcolumnのdiv要素を削除します。

画像の挿入

1. ヘッダー画像の呼び込み先を上記「準備の1」で取り込んだヘッダー画像のファイル名に書き換えます。
2. 上記3.で削除した部分に「figure」要素を挿入し、８枚の写真を取り込みます。
3. 最上部に配置する３枚の写真について高さを「240」に指定します。
4. ２段目の２枚の写真について高さを「220」に指定します。
5. 次の３枚の写真について高さを「193」に指定します。

CSSリンク・ナビメニューの修正

1. 「head」要素の「column3.css」へのリンクを削除します。
2. 「フォトギャラリー」のクラスを削除し、リンク先を入力します。
3. 「我が街」にクラス「current2」を追記します。