課題１２　ホームページに罫線（横線）をつけるには？

今日の研修内容

　前回は背景画像をつけたり、背景の色を変えたりして、見やすいホームページを装飾しました。今まで作成してきたホームページを見てみると、項目と項目の境がわかりにくいと思います。そこで、今日は項目の境を示すことができる罫線（横線）をつけてみましょう。

＜手順＞

（１）横罫線をつけるタグの設定

「スタート」「プログラム」「アクセサリ」「メモ帳」の順に選択し，次に「ファイル」「開く」の順に操作し、「3.5インチFD」にある「sample2.htm」ファイルを開きます。
背景に画像をつけるタグは、<HR SIZE=n>です。「sample2.htm」を次のように書きかえましょう。

<HTML><HEAD>
<TITLE>libra_j</TITLE>
</HEAD>
<BODY BACKGROUND="Fabric.gif">
<CENTER><H2>岐阜県図書館ホームページ</H2>
<FONT SIZE=5 COLOR=#FF0100>Gifu Prefectural Library</FONT>
</CENTER>
<HR SIZE=5>
<H4>自由に資料を・・・・・
　　　　　＝以下略＝

書き換えが完了したら，メモ帳の「ファイル」「上書き保存」を選択します。

（３）表示

「ネットスケープナビゲータ」を起動し、「ファイルを開く」「3.5インチFD」にある「sample2.htm」ファイルを指定します。

横罫線が追加されたホームページが展開されます。
　　　　　　　　　　（<HR SIZE=n>　　nの数字を大きくすると線が太くなります。）

ワンポイントアドバイス
　単に<HR>と書き込むだけでも横罫線になります。このときの太さは「n=２」の太さです。
　　線の長さも変えることができます。<HR SIZE=n WIDTH="*%">と指定します。「WIDTH=50%」のように、画面の横幅に対する割合で指定できます。"*"は、０から１００までの数字を指定します。
　<HR SIZE=n ALIGN=CENTER WIDTH="50%">と指定することで、画面の横幅に対する５０％の罫線を画面の中心に配置することができます。同様に、「ALIGN=RIGHT」とすると右寄せ、「ALIGN=LEFT」とすると左寄せになります。

＜まとめ＞

<HR>とは、「水平線(Horizontal Rule)」の略です。これを入れることにより、画面にメリハリが出てきましたね。この表示方法以外に、<HR NOSHADE>のように、”NOSHADE”を入れることで、陰影のない横線を位置づけることができます。太さ・長さ・種類・位置を工夫して使い、ホームページに簡単に装飾をつけてみましょう。

　　＜キーワード＞
　　<HR SIZE=n>　　横罫線をつけるタグ

作成者	埴岡靖司
所　属	伊自良南小学校

通信講座	岐阜県教育センター
第３章　ホームページの作成

第３章 ホームページの作成

第３章　ホームページの作成