［ＨＰを作ろう！］ ☆第１０回☆
こんばんは、ＴＨ６９です。
いよいよテキストだけで作るＨＰの最終回です。
今回は本当に最後だと思いますので、安心してお読み下さい（笑）。
前回、『水平線
』というのをやったんですけど、テストしてもらっている《月のウサギ》さんから
「hr の後ろに color のオプション（属性）で色を指定したら、線の色が変わった」
というレポートを頂きました。
私自身ほとんど使わないので忘れていたんですけど、
にもオプション（属性）があり
それを指定する事で、線の色・幅・太さ・影の有無などを変更する事が出来ます。
それで実際使ってみると、かなり使えそうなので、今回はそこから始めましょう。
タグの属性としては、次のような物があります。
１）size="○" …線の太さを指定できます。ピクセルで記入します。
２）width="○" …線の長さを指定できます。ピクセル or ％で記入します。
（％で指定した場合は、ウインドウの幅に対しての％になります）
３）color="○" …線の色を指定できます。
（私が勉強した時には、ＩＥだけのオプションでしたが…）
４）noshade …影のない線になります。ただ、色を指定した場合は最初から影は付かないようです。
この中で『ピクセル』という言葉は初めてでしょうか？
画像のサイズを表すときにもよく使われるのですが、私も詳しくは分かりません (^ ^;
いろいろやってみて大体の感じをつかんで下さいね。
ただ
とだけ記入した時には、２ピクセルの線が引かれるそうです。
それから私のパソコンの画面（１２．１インチ）では、横が約８００、縦が約６００くらいになっています。
では、いつものように［homepage］フォルダにある［index.html］ファイルを開いて、
そのソースを表示させて下さい。
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
私のホームページ
ようこそ！私のホームページ
へ
このページはただいま製作中です。
またのお越しを
お待ちしております。
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
このようになっていますね。（なっていない方は、この通りに直してくださいね）
それでは、前回記入した『ようこそ！私のホームページへ』の上下の線を変更してみましょう。
今回も皆さんにやってもらいましょう。
１）
を削除して下さい。（上下共です。以下、上下共同じようにやって下さい）
２）改めて
と記入して下さい。
３）線の太さを１０ピクセルにして下さい。
４）線の長さを６００ピクセルにして下さい。
５）線の色をオレンジ（#ffa500）にして下さい。
属性をいくつか指定する時は、半角スペースを空けるのを忘れないようにして下さいね。
線の長さは、幅だから『width』（ワイドの名詞形かな？）と覚えるといいでしょうか。
では、上書き保存して更新してみて下さい。
どうなりましたか？
『ようこそ！私のホームページへ』の上下に、太めのオレンジ色の線が入りませんでしたか？
言葉で説明するのは難しいので、復習用のページで確認して下さいね。
タグについては、これで終わりです。
次に、文字の装飾についてやりましょう。
これは、ワードなどにも付いている機能なんですが、
タグによって文字を太くしたり、斜体にしたり、下線を付けたりすることが出来るんです。
そうです。
ワードのツールバーにある [Ｂ]、[Ｉ]、[Ｕ] のボタンを押すと、そうなりますよね。
実はタグも同じなんですよ。（これは覚えやすいですね（笑））
で太字に、で斜体に、で下線がつきます。
他に
これが『１』の大きさです。［ＨＰを作ろう！］
これが『２』の大きさです。［ＨＰを作ろう！］
これが『３』の大きさです。［ＨＰを作ろう！］
これが『４』の大きさです。［ＨＰを作ろう！］
これが『５』の大きさです。［ＨＰを作ろう！］
これが『６』の大きさです。［ＨＰを作ろう！］
これが『７』の大きさです。［ＨＰを作ろう！］
どうですか？ うまくいきましたか？
［ＨＰを作ろう！］の大きさは、どうなっていますか？
１２３４５６７６５４３２１
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
このようになっていますね。（なっていない方は、この通りに直してくださいね）
でも、このようになっていない方も多いと思います（汗）。
実は、ちょっと間違っていまして、
で大きくした文字は、で小さくするのではなく、で元に戻す、
というのが正しいようです。
すみませんが、訂正をお願いします。
それで、数字を大きくしたり小さくしたその下に（の下ですね）
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
ＴＨ６９の［ＨＰを作ろう！］
ＴＨ６９の［ＨＰを作ろう！］
ＴＨ６９の［ＨＰを作ろう！］
ＴＨ６９の［ＨＰを作ろう！］
ＴＨ６９の［ＨＰを作ろう！］
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
と記入して下さい。
そして上書き保存して更新すると…
変わりましたか？
一番上はノーマル（そのまま）の文字、次が太字、次が斜体、次が下線、最後が抹消線です。
これらのタグを使うと、グッとページが華やかになりますね。
では、これらのタグを使って［index.html］ファイルで練習してみましょう。
ソースは
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
私のホームページ
ようこそ！私のホームページ
へ
このページはただいま製作中です。
またのお越しを
お待ちしております。
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
のようになっていると思います。
ここで、練習してみましょう。
１）『このページはただいま製作中です。』を太字にして下さい。
２）『またのお越しをお待ちしております』の下に、１行空けて
『２００１年６月１７日 製作開始』と記入して下さい。（日付は適当でいいですよ）
３）『２００１年６月１７日 製作開始』の文字の色を青（#0000ff）にして下さい。
４）『２００１年６月１７日 製作開始』の文字を、斜体にして、下線をつけて下さい。
以上です。
どうでしょうか？ うまく行きましたか？
うまく行かなかった方は、下にタグを書いておきますので、確認して下さいね。
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
私のホームページ
ようこそ！私のホームページ
へ
このページはただいま製作中です。
またのお越しを
お待ちしております。
２００１年６月１７日 製作開始
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
やっとここまでたどりつけました。
本当はもっと簡単にやるつもりだったんですけど、やりだすと何だか頑張ってしまうんですよね (^ ^;
ここまでやって下さった皆さん、ありがとうございました。
うまく出来たでしょうか。
分からない時は、いつでもご質問下さいね。
テキストだけのＨＰの作り方はこれで終わりですので、後は皆さん自身で
自分なりのＨＰを考えてみて下さい。
もし、そういうページが出来ましたら、私のページで紹介したいと思いますので、
どうかお送り下さいね。
それについては、次回《号外》という形で募集したいと思っています。
では、次の回からは画像についてやりましょう。
これをやりだすと、さらに面白いですよ。
それから、とりあえず画像はこちらで用意しますので、ご心配なく (^o^)
では、第１１回でお会いしましょう。