★Lesson3★
〜文字の装飾編〜


○3:文字の装飾編

 今回はTOPページに文字を挿入していきましょう。完成図はこんな感じになります。

★CENTERタグ<center>〜</center>

このタグは、文字通りCENTER(中央)に文字等を表示させるタグです。

★改行タグ<br>

改行させるためのタグです。このタグは「はじめ〜おわり」という文字を間に挟む方式のタグではありません。ですので、改行したい部分にタグを記述するのみです。使い方としては、改行したい文章の文末に記述したりします。

★Pタグ<p>〜</p>

段落(文中の1つの意味のまとまり)を指定することが出来ます。ブラウザで見ると段落と段落の間に1行分の間隔が空きます。

★Hタグ<h*>〜</h*>

文字が見出しとして扱われるタグですH1〜H6があり、より重要な見出しになる程、1に近くなります。よって、H1(大見出し)⇒H6(小見出し)という風に使用します。尚、文字の大きさを変更するだけに使う場合は、別にそれ専用のタグがありますので、そっちを使うようにしましょう。

★テキストの太字表示<b>〜</b>

自分の記述した文章を太くしたい場合に使用します。使い方としては、強調したい部分に使用するといいでしょう。文章全体を太くすることも勿論可能ですが、あまり「そうする意味」はないかもしれません。

★STRONGタグ<strong>〜</strong>

↑と同じく太字にするタグです。

★文字をワンランク大きくする<big>〜</big>

通常の文字よりひとまわり大きくなります。先程説明した「テキストの太字表示」のタグと併せて使用すれば、「太く、大きな」文字となり、より強調される文字になります。

★斜体表示<i>〜</i>

文字を斜体で表示します。

★EMタグ<em>〜</em>

↑と同じく、斜体文字にするタグです。

★抹消線<s>〜</s>

文字に抹消線をつけるタグです。特に使うことないんで例題では使用せず、ここでの紹介のみとしておきます。

★STRIKEタグ<strike>〜</strike>

↑と同じく、文字に抹消線を入れるタグです。

★文字をワンランク小さくする<small>〜</small>

「文字をワンランク大きくする」タグの正反対の「文字が小さくなる」タグです。

★下線<u>〜</u>

文字の下に下線をひきます。

では実際記述していきましょう。 <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<title>☆スカイエリアのサイト☆</title>
</head>
<body>

<center><small>〜趣味のページ〜</small>
<h1><i>☆スカイエリアのサイト☆</i></h1></center> <br>
<br>
<br>


<center> <p> <b><big><i>Welcome to SKY-AREA home page!!</i></big></b><br>
ここは私が作成したホームページです。 </p>

<p> まだまだコンテンツ数は少なく、内容も浅く、発展途上なサイトですが、<br>
これから頑張って充実したコンテンツを用意していきますので、<br>
よろしくお願いしますm(_ _)m </p> </center>

</body>
</html>

今回は以上です。どうです?こんな感じになりましたか?この調子でどんどんタグは増えていきます。と、言っても、かなり初歩的なタグしか紹介しませんので、言う程難しくもないはずです。勿論、必要性が高く、尚且つ簡単なタグだけを厳選していますので、これがHTMLタグの全てだとは思わないで下さい。次回は「〜特殊タグ編〜」です。今回でも十分製作しているじゃないかと思うかもしれませんが、もっと深くいってみたいと思います。


≪≪前のレッスンへ戻るレッスンページTOP次のレッスンへ進む≫≫