保存してください。ちなみにこのindeｘ.htmlという名前はページの表紙（ホーム）を意味するものなので、しっかりと頭に入れておいてください。さて、保存するとインターネットエクスプロラーのようなアイコンが新しくデスクトップに出来ていると思います。ダブルクリックして開いてみてください。参考までに、私のはこうなりました。ちなみに、ウィンドウの上にある表示をクリックして、ソースをクリックすると、私が実際に書いたＨＴＭＬのテキストが見れますので、そちらを見て参考にしてもらっても構いません。さてどうでしょうか。文字はきちんと出ていますか？出ているならば、今貴方が作ったＨＰの中で、貴方の書いた物がどう反映されているかをちょっと考えてみましょう。表示されている言葉はいいですね。ではTITLEで囲った言葉はどこにあるのでしょうか。気付きましたか？ウィンドウの上の、青い部分に出ているわけですね。 つまり、<TITLE>というタグはウィンドウにタイトルをつける機能があるわけです。また「/」はスラッシュと読み、そのタグの機能が作用する範囲を指定しています。順に見ていきましょう。 <HTML>は、ＨＴＭＬで記述するぞ〜という宣言のようなもので、特に機能として意味はありませんが、必要なもの なので必ず書くことにしましょう。<HEAD>もHEADタグと同じようなものです。この二つは 形式と思って、取り敢えず書く習慣をつけることをお勧めします。そして重要なのが<BODY> というタグです。何故なら、
| <BODY>
</BODY> |
という、この二つのBODYタグで囲まれた所に本文を書いていくからです。さてこれを理解し、また出来てしまうと 人間欲深いもので、文字を色々と飾りたくなりますよね(断定)
では次に、文字の飾りつけや移動なんかをしてみましょう。
文字の移動タグ
<BODY>
（この行には好きな食べ物の名前を書いて下さい）
(上と同じように、食べ物の名前を入れて下さい)<BR>
(上と同じように、食べ物の名前を入れて下さい)<P>
</BODY>
（３行くらい書いてみて）
</PRE>
すると結果はこのようになります。ソースとの文字の位置が同じになっているでしょう。ただこいつを使うと、何故か文字が小さくなってしまう上に、PREタグでの文字位置定義はどうも厳密ではないようなので、意図した場所に文字がいかない事が多々あります。（経験者は語る）。使うならあまり長い文にしない
ことをお勧めします。それとPREタグは閉鎖性があるので、例えばPREタグ以降の文字の色を変えたい場合、PREタグを定義した後に色変えのタグを定義するようにしましょう。PREタグ前に定義すると、その効果はPREタグに遮られ作用しなくなります。
(2)文字寄せ <CENTER> <DIV ALIGN="">
ここでは文字の寄せ方を覚えてみましょう。CENTERタグは
例の如くサンプルです。一般的な
文字位置指定の遣り方は取り敢えずこんなところです。
後々新しい遣り方が見つかったらアップしていきますので、
そこはかとなく期待して待っていて下さい。
<BR>は改行を表すタグです。HTMLでは、行末でエンター キーを押しても改行になりません。そして空白（スペース）は連 続して何個入力しても一個分のスペースしか出来ません。何 故そんな面倒くさいことをしたのかは、ＨＴＭＬを作った人に直 接聞いて下さい。そして<P>は段落を表すタグです。ではさっそく使い方の説明をしますが、実際にやってみたほうが速いし分かりやすいので、いきなり作ってみましょう。ああそれと、フォルダ を作ってそこに自作のｈｔｍｌファイル関連を収納しておくことを お勧めします。理由はまた後ほど。ではいきますよ
<HTML>
<HEAD>
<TITLE>改行と段落</TITLE>
</HEAD>
（この行には好きな国の名前を書いてください）<Ｐ>
( 同上 )<Ｐ>
( 同上 )<Ｐ>
</ＨTML>
この通りに書いた結果、作者はこのようなものが出来あがりあました。
どうでしょう、上手くいきましたか？結果を見て分かるように、
文の間に何もタグを入れないときは文章が繋がってしまい、
逆に<ＢＲ>を入れたものはきちんと改行が成されていますね。
そして<Ｐ>のタグを入れたものは、間に一行分の空欄が出来ているはずです。
これが改行<ＢＲ>と段落<Ｐ>の違いであり、ＨＴＭＬにおける改行の面倒くさいところです。
しかしこれを解消する良いタグがしっかり定義されているあたり、
ＨＴＭＬもなかなかやるものです。
これは私達が普通にエンターで改行するのをそのままブラウザに
反映させるという優れ物で、
定義の仕方は以下の通りになります。
<PRE>
その名の通り文字を中央に寄せるタグです。そしてDIV ALIGN=""
タグも同じ機能を持っているのですが、" "の中にcenter,left,right
を入れる事により、文字を中央寄せ、左寄せ、右寄せと指定する
ことが出来ます。汎用性を考えて、DIV ALIGN=""タグをなるべく
使うようにするといいかもです。まあ、CENTERもお手軽で重宝して
ますけどね（笑
じゃあ早速使ってみましょう
<CENTER>
（好きな曲のタイトルを書いてみよう）
</CENTER>
<DIV ALIGN="left">
(好きなバンドを書いてみよう)
</DIV>
<DIV ALIGN="right">
(好きなボーカリストを書いてみよう)
</DIV>