早速作ってみましょう・・・文章の基本配列、文字の色、大きさ、書体 |
| ■ |
HTML文書の基本構造
タグの基本配列は次のようになります
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY></BODY>
</HTML> |
<HTML></HTML>でこの文書はHTML言語の始まりと終了であることを宣言します。
<HEAD></HEAD>見出しのこと。
<TITLE></TITLE>タイトル
<BODY></BODY>中身の内容。
<BR>改行
<P>段落
< / >スラッシュはそのタグのコマンドの終了を意味します。 |
|
| ■ |
練習1 (メモ帳などのテキストエディタを開いて次の通り書き込んでください)
<HTML>
<HEAD>
<TITLE>私のホームページ</TITLE>
</HEAD>
<BODY> こんにちわ私のホームページにようこそ
</BODY>
</HTML>
|
大文字、小文字どちらで書いてもOKです。出来ればどちらかに統一して書き込むとミスが少なくなります。 |
出来たら
メモ帳の [ファイル]→[名前を付けて保存] を実行してください。
ファイル選択ダイアログが表示されるので、先ほど作ったフォルダ(C:\Web )に移動してください。[ファイル名]
に index.html と入力し、[保存] ボタンを押してください。保存するときは、半角英数字で名前を付けてください
このようにファイルが保存できました。Webフォルダー開いて index.html のファイルをダブルクリックしてください。このようなホームページが開いたでしょうか??
|
| ■ |
練習2 (文字の色を変えてみましょう)
<HTML>
<HEAD>
<TITLE>私のホームページ</TITLE>
</HEAD>
<BODY> こんにちわ<FONT COLOR=red>私のホームページ</FONT>にようこそ
</BODY>
</HTML> |
赤字の部分を付け加えてください
font clor=red はここからフォント(文字)の色をRed(赤色)にしなさい。と言うコマンドになります。
</font>は、そのコマンドの終了を意味します。 |
同様に index2.html と言う名前で保存してください。上記と同じようにファイルをダブルクリックしてください。「私のホームページ」が赤色に表示されましたか?
|
|
|
|
| ■ |
練習3 (文字の大きさを変えてみましょう)
<HTML>
<HEAD>
<TITL>私のホームページ</TITLE>
</HEAD>
<BODY> こんにちわ<FONT color=red SIZE=6>私のホームページ</FONT>にようこそ
</BODY>
</HTML> |
さらに青字の部分を付け加えてください
font size=6 はフォント(文字)の大きさを「6」にしなさいと言うコマンドでスペースを空けて他のコマンドと重複して書き込んでもOKです。
サイズは指定のない場合は「3」です。1〜7まで指定できます。また標準から+1とかー1とか指定することもできます。色々変えてやってみたら面白いと思います。 |
| 同様に index3.html と言う名前で保存してください。上記と同じようにファイルをダブルクリックしてください。「私のホームページ」が大きくなったでしょうか?
|
|
| ■ |
練習4 (文字の太さと文章の改行)
<HTML>
<HEAD>
<TITLE>私のホームページ</TITLE>
</HEAD>
<BODY> <B>こんにちわ</B><BR><FONT COLOR=red SIZE=6>私のホームページ</FONT>にようこそ
</BODY>
</HTML> |
こんにちわの文字を太字にしてここで改行してみましょう。緑色の部分をさらに書き加えてください。
b は太字にしなさいと言うコマンドです
br はここで改行しなさいというコマンドです。
br p などのコマンドは終了を意味する< />は記入しなくてもOKです。 |
同様に index4.html と言う名前で保存してください。上記と同じようにファイルをダブルクリックしてください。「こんにちわ」が太字になり、そのあとで改行されたでしょうか?
<b>こんにちわ</b><br><font color=red size=6 FACE="MS 明朝>私のホームページ</font>にようこそ
上記の文に茶色の部分を付け加えてください、次のようになったでしょうか
こんにちわ
私のホームページにようこそ
FACE="書体"で文字の書体が指定できます
|
|
|
|
|
|