[作成：1999/9/8]
Step1 基本タグ
- タグは半角英字の大文字でも小文字でもかまいません。
＜ｈｔｍｌ＞ここからHTML文書が始まる記号です。
＜／ｈｔｍｌ＞はHTML文書が終わる記号です。
このように、＜ｈｔｍｌ＞と＜／ｈｔｍｌ＞に挟まれた中身がHTML文書です。
＜ｈｅａｄ＞と＜／ｈｅａｄ＞の中に、タイトルを＜ｔｉｔｌｅ＞タイトル名＜／ｔｉｔｌｅ＞と書きます。
＜ｂｏｄｙ＞と＜／ｂｏｄｙ＞の中に本文を書きます。これらがHTML文書の基本タグです。Step1をクリックしてみて下さい。
Step2 背景色；テキスト文の色
- 画面の背景の色と文字の色は＜ｂｏｄｙ＞タグの中に指定します。どのように指定するかはStep2をクリックして、文書のソースで調べてみて下さい。
Step3 色の指定
- 色は次のように表します。
"#FFFFFF" は白、"#000000" は黒。各位置には 0,1,2,3,4,5,6,7,8,9,A,B,C.D.E.F が入ります。例えば、"#05A9F4" "#679201" "#C3EA0B" 等たくさん指定できます。白から黒の間には赤"#FF0000"や緑"#00FF00"や
青"#0000FF"の度合いの違いにより非常にたくさんの色ができます。Step3をクリックしてみて下さい。
[作成：1999/9/11]
Step4 罫線；改行
- 罫線タグは＜ＨＲ＞です。太さ、長さは例えば、＜ＨＲ ｓｉｚｅ＝５ ｗｉｄｔｈ＝５０％＞と指示します。
改行タグは＜ＢＲ＞です。これを２回使うと１行分スペースが空きます。＜Ｐ＞を使うこともできます。
☆以後、[表示(V)→ソース(C)]をクリックしてタグの確認を忘れずに！
Step5 文字の大きさ；文字の大きさと色
- 文字の大きさを指定するタグは例えば＜H３＞文字＜/Ｈ３＞です。数字は１から６まで指定できます。１が最大、６が最小。見出し語のときに使うことが多いです。
文字の大きさと色を同時に指定するときは、例えば
＜ｆｏｎｔ ｓｉｚｅ＝５ ｃｏｌｏｒ＝"#0000FF"＞文字＜/ｆｏｎｔ＞
この場合、色は青ですね。大きさは数字が大きくなるほど大きくなります。
[作成：1999/9/12]
Step6 文字の装飾；文字の位置合わせ
- 文字をボールド(太字)にするタグは ＜Ｂ＞文字＜／Ｂ＞ です。
文字をイタリック(斜体)にするタグは ＜Ｉ＞文字＜／Ｉ＞ です。
文字をセンタリングするタグは ＜Ｐ ＡＬＩＧＮ＝ＣＥＮＴＥＲ＞文字＜／Ｐ＞ です。
または ＜ＣＥＮＴＥＲ＞文字＜／ＣＥＮＴＥＲ＞ の方法もあります。
文字を右に揃えるタグは ＜Ｐ ＡＬＩＧＮ＝ＲＩＧＨＴ＞文字＜／Ｐ＞ です。
文字を左に揃えるタグは ＜Ｐ ＡＬＩＧＮ＝ＬＥＦＴ＞文字＜／Ｐ＞ です。但し、デフォルトでは左揃えになっていますから指示しません。
Step7 ＨＰ作者宛電子メール；他のファイルへのジャンプ
- ホームページ作者宛電子メール送信機能を立ち上げるには
＜Ａ ＨＲＥＦ＝”ｍａｉｌｔｏ：[電子メールアドレス]”＞[キーワード]＜／Ａ＞ とします。
他のファイル(同じフォルダー内にある)へジャンプするには
＜Ａ ＨＲＥＦ＝”[リンク先のファイル名]”＞[文字列]＜／Ａ＞ とします。
[作成：1999/9/16]
Step8 画像の表示；画像の位置合わせ
- ＨＰ上で表示できる画像は .gif (.GIF) または .jpg の拡張子の付いたものだけです。
画像を表示するタグは ＜ＩＭＧ ＳＲＣ＝"[画像ファイル名]"＞ です。
画像をセンタリングするタグは ＜Ｐ ＡＬＩＧＮ＝ＣＥＮＴＥＲ＞＜ＩＭＧ ＳＲＣ＝"[画像ファイル名]"＞＜／Ｐ＞ です。
または ＜ＣＥＮＴＥＲ＞＜ＩＭＧ ＳＲＣ＝"[画像ファイル名]"＞＜／ＣＥＮＴＥＲ＞ の方法もあります。
画像を右に揃えるタグは ＜Ｐ ＡＬＩＧＮ＝ＲＩＧＨＴ＞＜ＩＭＧ ＳＲＣ＝"[画像ファイル名]"＞＜／Ｐ＞ です。
画像を左に揃えるタグは ＜Ｐ ＡＬＩＧＮ＝ＬＥＦＴ＞＜ＩＭＧ ＳＲＣ＝"[画像ファイル名]"＞＜／Ｐ＞ です。但し、デフォルトでは左揃えになっていますから指示しません。
[作成：1999/9/19]
ご自身の"便箋"を作ってみませんか
- ※ HTMLファイルの背景を画像にすることもできます。
＜ｂｏｄｙ ｂａｃｋｇｒｏｕｎｄ＝”ファイル名 .gif”＞と指定します。
まずHereをクリックしてその具体的な様子を見た後に、便箋の作り方をお読み下さい。
[作成：1999/9/24]
Step9 画像サイズ指定
- 画像サイズを指定するタグコマンド：
＜ＩＭＧ ＳＲＣ＝”[画像ファイル名]” ＷＩＤＴＨ＝”[数値]” ＨＥＩＧＨＴ＝”[数値]”＞
☆[数値]は画像のドット数
Step10 画像を見出しのアクセントにする
- 画像と文字を揃える：
＜ＩＭＧ ＳＲＣ＝”[画像ファイル名]”＞[文字列]
文字を画像の右上に揃える：
＜ＩＭＧ ＳＲＣ＝”[画像ファイル名]” ＡＬＩＧＮ＝”ＴＯＰ”＞[文字列]
文字を画像の右中央に揃える：
＜ＩＭＧ ＳＲＣ＝”[画像ファイル名]” ＡＬＩＧＮ＝”ＣＥＮＴＥＲ”＞[文字列]
Step11 テキストの回り込み
- 画像を左に、文字を右に回り込ませる：
＜ＩＭＧ ＳＲＣ＝”[画像ファイル名]” ＡＬＩＧＮ＝”ＬＥＦＴ”＞[文]
画像を右に、文字を左に回り込ませる：
＜ＩＭＧ ＳＲＣ＝”[画像ファイル名]” ＡＬＩＧＮ＝”ＲＩＧＨＴ”＞[文]
[作成：1999/10/13]
Step12 その他
- 見出しと本文（日記などに応用できます）：
＜ｄｌ＞＜ｄｔ＞見出し＜ｄｄ＞本文＜／ｄｌ＞
引用文：
＜ｂｌｏｃｋｑｕｏｔｅ＞引用文＜／ｂｌｏｃｋｑｕｏｔｅ＞
百合野ヶ原へ戻る