HTMLの入力と保存

HTMLは、[メモ帳]を開きこれに書き込みます。[メモ帳]の開き方は、[スタート]→[すべてのプログラム][アクセサリー]→[メモ帳]です。また、保存する方法は、[フアイル]→[名前を付けて保存]をクリック→[フアイル名に入力]→[保存する場所を指定]→[保存]をクリック。

[フアイル名に入力]→トップページは[index.html]と書きます。
[保存する場所を指定]→予め[My Documents]の中に専用のフオルダ(例えばhomepageという名前のフオルダ)を作り、ここに保存します。
[index.html]等すべてのhtmlは、[英数半角]で書くことが決まりです。[index]と[html]の間には必ず[.]を書き込んでください。


ページの基本設定


ページ作成に必要な基本的な[タグ]は左図の通りです。

<html>は、ページの最初に記述します。

<head>は、HTML文書に関する様々な情報を記述します。

<title>は、文書のタイトルを指定します。

</title>は、タイトルの終了タグ。

</head><body>ここから本文が始まります。

</body>は、本文の終了タグ。

</html>は、ページの最後に記述します。

[<][>][/]などの記号があるキーボードの位置を確認してください。


[<] [>] [/]は、キーボードの5列目の[ね][る][め]の処にあります。[<][>]は、[Shift]キーを押しながらここをクリックしてください。




文字の装飾(見出し)

[見出し]にはH1からH6まであります。見出しの文字色や見出しの位置の指定もタグの書き込みで出来ます。


一番上からh1、h2、h3、h4、h5、h6のサイズで表示してあります。大きさを比較して見てください。


[見出し]に[色]を付けるには次のように記述します。

<font color="色"></font>と書きます。

[色]の指定には[十六進法]と[カラーコード指定]の2通があります。

[見出し]の[位置]を指定するには次のように記述します。

 <h○ align="位置"></h○>

 [h○]の[○]には、h1からh6までの数字を書きます。

 [h○]と[align]の間は[半角スペース]とします。

 [位置]の指定には["位置"]のように["]ダブルコーテー  ションが必要です。

 [位置]の指定は[left][center][right] の3通です。

文字の装飾(区切り線)

[区切り線]を引くには、[<hr>]を使います。一般にタグは、開始タグと終了タグをセットで記述します(例示<html>と</html><head>と</head>等)が、<hr>は、開始タグのみで終了タグは書き込む必要がありません。

[区切り線]の太さを指定する→<hr size="○○"> (○○にはピクセル数を書きます)。

[区切り線]の色を設定する→<hr color="色"> (色は例えば赤の場合はred 青の場合はblue等)。

[区切り線]の長さを設定する→<hr width="●●%"> (通常は%を使います)。

[区切り線]の左右の幅を指定するには[ピクセル数]と、[%]で表示する方法があります。[%]は、ブラウザのウインドウ幅に対する割合で指定します。一方、[ピクセル数]で指定すると、指定した長さで引かれます。<hr nonshade>このタグを記述すると、区切り線に影を付けない指定となります。左図に表示した区切り線のサイズはは上から10px 5px 2px です。長さ(幅)の表示では上から90% 70% 50%です。

文字の装飾(フオント)

[フオント]の装飾には[大字][斜体][下線]などがあり、フオントの[サイズ]には[基準値]と[相対値]がありますが、通常は[基準値]を使います。基準値には下の例示のように[1から7]までの数字をを使います。

[サイズ]の設定→<font size="数字"></font> (数字は1から7までの数字を記述)。

[字体]の設定→<font face="△△"></font> (△△には例えば[MS明朝]等)。

[フオント]のサイズは1から7迄あり、[1]が最小、[7]が最大です。
一般的には文字の大きさの基準値は[3]で設定されています。従って<font size="+1">は、<font size="4">と同じ事です。左図の表示は上から[font size 7、 6、 5、 4、3、 2、 1]です。カラー文字のサイズは上から 7、 6、 5、です。