基本のタグを使ってHTMLを書いてみよう！その２

HTMLの基礎的なタグを使って、どのように表示されるか確認してみましょうの2回目です。
前回の記事。

今回使うタグは以下のタグ（要素）です。また、作業が多い為、説明が長くなっておりわかりにくかったらすいません。

html、head、body、title、h1、h2、hr、p、img、a、font

作業手順の概要と作成イメージは以下の通りです。

1. メモ帳を開いてHTMLを記述する
   （サクラエディタを利用してもOK→サクラエディタについて）
2. ブラウザで確認する
3. 編集作業を行う（追加指示）

完成イメージ（IEでの確認イメージ）

１．メモ帳を開いてHTMLを記述する

メモ帳（もしくは他のテキストエディタ）を開いてHTMLを記述します。

1. 「スタートボタン」をクリック
2. 「すべてのプログラム」をクリック（またはポイント）
3. 「アクセサリ」をクリック
4. 「メモ帳」をクリック

HTMLは以下のように記述して下さい。（「」は入力しません）

1. html、head、bodyを記述しましょう
2. タイトル（titleタグ）は「ブラウザの種類」
3. h1には「ブラウザの種類」を設定
4. h2には「InternetExplorer」「Firefox」「Chrome」をそれぞれ設定
5. InternetExplorerの下には以下の文章を段落設定して記述します
   「Microsoft社製のブラウザソフト。略してIEとも呼ばれる。利用者が多い為、Webサイトを作成する際にはIEでの表示は確認必須！」
6. Firefoxの下には以下の文章を段落設定して記述します
   「Mozillaが製作しているブラウザソフト。機能の拡張性に優れており、アドオンという追加機能を入れることによりより使いやすくカスタマイズできる。」
7. Chromeの下には以下の文章を段落設定して記述します
   「google社製のブラウザソフト。シンプルに作成されており高速にWebサイトを閲覧することができる。」

入力ができたら保存します。

1. メニューバーのファイルから「名前を付けて保存」をクリック
2. 保存場所（任意：下図ではマイドキュメント）を指定した後、ファイル名に「browser.html」（ドットhtmlの入力ミス注意）と入力し、「保存」をクリック
   

※名前や拡張子を間違ってしまった場合、保存した場所へ移動し、右クリックの「名前の変更」で名前や拡張子を変更しましょう。

２．ブラウザで確認する

保存されたHTMLファイルをブラウザで確認します。

1. ブラウザを起動します
2. browser.htmlを保存した場所を表示します
3. htmlファイルをダブルクリックするか、ブラウザにドラッグします

※編集がある場合、ブラウザはそのままにしておきましょう。

３．追加指示と再度確認

今回は追加指示があります。完成イメージは以下の通りです。

1. メモ帳を起動する（browser.htmlがメモ帳で開いている場合は3から）
2. browser.htmlの保存されている場所を開き、メモ帳にドラッグする
3. 以下のように変更する
   1. 各見出しには以下のようにfontタグで色を設定して下さい。
      ブラウザの種類:#316745
      InternetExplorer:#7de9ff
      Firefox:#da5225
      Chrome:#e02629
   2. browser.htmlと同じ場所にimgフォルダを作成し、その中にページに貼り付ける画像を保存します。
      ※貼り付け用の画像の準備は下の補足参照
   3. 各段落の最初にはimgタグで画像を貼り付けます。できればタイトルを任意で設定して下さい
4. メニューバーの「上書き保存」をクリックする
5. browser.htmlのブラウザ画面を表示し、編集前の状態の場合、キーボードの「F5」を押して更新する

補足：貼り付け用の画像は下の画像を右クリックして、「名前を付けて画像を保存」を行ってください。（保存する名前は任意です。）