Additonal Information about HTML Tags (11/19/99)

Back to: Comp Home


<HTML>このファイルがHTMLファイルであることを宣言する記述です。削除しないで下さい。HTMLファイルはこの記述で始まり、最後の行は</HTML>で閉じないとファイルが正しく表示されません。

<HEAD><head>から</head>の間にファイルに関する情報を記述します。
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">この行は「おまじない」と思って下さい。削除可能ですが、最後にcharset=iso-8859-1と記述することにより、アルファベットを英語用のフォント(字体)で表示させる役目を果たしています。"iso-8859-1"の代わりに"x-sjis"と記述すると日本語用のフォントで文字を表示します。従って日本語を表示させることができます。
<TITLE>Project 2</TITLE><title>から</title>の間にブラウザー(Netscape)の左上角にこのファイルを開いたときに表示させたいファイルのタイトル名を記述します。ブラウザーの画面に表示させるタイトル名ではありません。従って、<TITLE>Shimada</TITLE>のように自分の名前などに変更して構いません。また、このページをBookmarkしたときは、ここに記述したタイトル名でBookmarkに保存されます。
</HEAD><head>はここで終わると宣言しています。

<body background="shimada-parchmnt.gif" bgcolor="#C0C0C0" text="#000000"><body>はここからホームページの本体(画面に表示される内容)が始まることを意味します。もっとも単純な場合<body>のみで構いませんが、必ず<body>と宣言して下さい。
bodyの後にこのページの背景や文字の色などをどうするか指定することができます。 background="shimada-parchmnt.gif"は背景としてshimada-parchmnt.gifという画像を表示させなさいという意味です。
bgcolor="#C0C0C0"は背景の色を"#C0C0C0"(灰色)にしなさい、という意味です。ただし、この場合は背景画像としてshimada-parchmnt.gifを表示するよう指定していますので、背景の灰色は一瞬しか表示されません。
text="#000000"は特に指定がない限り本文の文字は"#000000"(黒)で表示しなさい、という意味です。色を表す記号は「HTMLの書き方」や
Color Referenceのあるサイトを参照して下さい。
link="#C0C0C0" vlink="#CCCC99"のように、リンクを貼ってある文字の色と訪問済みのリンクを貼ってある文字の色を指定することもできます。上記のようにlinkとvlinkを指定すると、リンクを貼ってある文字の色が銀色(#C0C0C0)、訪問済みのリンクが金色(#CCCC99)に表示されます。

<CENTER>以下(ここではMy Second Project)を行の中央に表示させなさい、というタグです。
<B>ブロック体(太字)で表示しなさい、というタグです。
<H1>見出しとして表示しなさい、というタグです。数字は文字の大きさを表し、1から6まで使えます。数字が大きくなると文字が小さく表示されます。
My Second Project「見出し」ですがレポートのタイトルに書き換えて下さい。
</H1><H1>がここで終わったことを示します。</xxx>は<xxx>タグがそこで終わることを示します。例外はありますが、原則として終了タグをつけて下さい。以下終了タグの説明は省略します。
</B>
</CENTER>

<p>パラグラフを挿入しなさい、というタグです。ここではパラグラフの中身がないので、一行カラの行を挿入する、つまり改行と同じ意味を持ちます。<br><br>と同じ結果になります。

<p align="center">上記と同じくパラグラフを挿入しなさい、というタグですが、ここでは中身がありますから、最後に</p>という終了タグが必要です。align="center"は<center>と同じく、以下の中身を行の中央に表示しなさい、という命令です。
<font size="5"><font>は以下に表示する文字の大きさ、色、字体を指定したいときに使います。大きさはsize="5"のように数字で指定します。1から7の範囲で、数字が大きいほど、大きさも大きくなります。
<font size="6" color="red" face="Arial">のようにすると、文字の色(color)と字体(face)も指定できます。この例は2番目に大きい"6"の大きさで、色は赤("#FF0000"のように色を表す記号を使うのが普通ですが、red, blue, green等の原色は色を表す単語も使用可能です)、字体は"Arial"という英作文のホームページで用いているフォントで表示しなさい、と命令したことになります。英文のホームページでよく使われる字体にはちょっとユーモラスな"Comic Sans MS"などがあります(パソコンにそのフォントがインストールされていなければ字体は変わりません)。
主な色の指定は次の通りです:黒 #000000 (black), 白 #FFFFFF (white), 青 #0000FF (blue), 空色 #87CEEB (skyblue), 赤 #FF0000 (red), ピンク #FFC0CB (pink), 黄緑 #00FF00 (lime), 緑 #008000 (green), 紫 #800080 (purple), オレンジ #FFA500 (orange)  複雑な色を使いたい場合はColor Referenceのあるサイトを参照して下さい。

<b>太字で表示。前述。
Project 2
</b>
</font>フォントの属性は必ず終了タグをつけて解除して下さい。


<p align="center">
<font size="3">フォントサイズを指定しなかった場合は"4"で表示されますので、基本表示サイズより1ランク小さい表示になります。
<b>
Last modified on October 23, 1999更新したファイルを送るとき、いつもその日の日付に修正して下さい。
</b>
</font>
</p>


<hr>水平線を1本引きなさい、というタグです。終了タグは必要ありません。フェリックスの下にある長い横線です。<hr size="3" width="50%">のように線の太さ(size)を数字で、線の長さ(width)を数字やパーセントで指定することもできます。

<center>以下を行の中央に表示。
<table border="0" width="90%"><table>とは表として表示しなさい、という意味です。ここでは表の枠(border)は0(つまり表示しない)、表の幅は表示画面の90%とする、という表の属性を指定しています。つまり以下の行はすべて枠のない表の中に表示されることになるため、左右のマージン(余白)付きで表示されます。
<tr>以下が表の1列目であることを示します。<tr>はこのページでは一つしかないので、表に列がないことになります。
<td width="100%"><td>は列の中にある行(厳密には「セル」)を示します。<td>もこのページでは一つしかないので、以下の行は全て表の中にある表と同じサイズのマス(セル)の中に、マスと同じ幅で(width="100%")表示されることになります。<table><tr><td>を使わなくても構いません。その場合はこのページのように両端に余白はできません。
<hr>水平線ですが、表(厳密にはマス)の中の水平線なので、上の水平線より余白の分だけ短くなります。

<p>次行のリンクのパラグラフが始まることを意味します。
Back to: <A HREF="../comp99pr2.htm"><b>Project 2 Home</b></A>相対パスで指定されている一つ上のフォルダにあるcomp99pr2.htmというファイル(ページ)に、太字で表示されている(<b>)Project 2 Homeという文字列をクリックするとジャンプします、ということを意味します。リンクの終了タグ</A>を付け忘れないようにして下さい。
</p>前行のパラグラフを終了して、1行改行します。
<p>
<a href="shimada02.htm">Next Page</a>
</p>
このピンク色の3行を記述すれば文字列Next Pageをクリックすると同じフォルダーのshimada02.htmにジャンプします。

<p>
ここに最初のパラグラフを書き込みます。<p align="left">と同じ意味。"left"の代わりに"center"とすると、このパラグラフは中央に表示されます。"right"とすると右側に寄ります。
</p>
<p>
ここに2番目のパラグラフを書き込みます。
</p>
<p>
ここに3番目のパラグラフを書き込みます。
</p>

<hr>水平線。
</td>大きなマス(セル)が終わることを宣言しています。1マスしかないので、このページでは表と同じことになります。
</tr>列が終わることを宣言しています。1列しかないので、このページでは表と同じことになります。
</table>表が終わることを宣言しています。
</center>表を中央に置くよう命令したので、それを解除しています。

</BODY>ページの本文が終了したことを宣言しています。

</HTML>HTMLが終わったことを宣言しています。