このページではフォント(書体)の指定をしてみましょう。
フォントの指定をしなければ、次のように指定したことになります。
| サイズ | 3 |
| 書体 | MS Pゴシック |
| 色 | 黒 |
| スタイル | 標準 |
フォントを指定をする文字の前後を <FONT> と </FONT> で囲み、<FONT の後ろに半角スペースを空けて指定するタグを記述します。
では【ホームページ作成の第一歩】で作成したページに表示された文字「私のホームページ」にフォントの指定をしましょう。
- index.html をダブルクリックして画面を表示します。
- 「メニューバー」の「表示」→「ソース」とクリックをして「メモ帖」に記述された「ソース」を表示します。
- 私のホームページ の前に <FONT SIZE="6" FACE="MS 明朝" COLOR="#FF0000"> 、後ろに
</FONT> を記述します。
<HTML>
<HEAD>
<TITLE>初めてのホームページ</TITLE>
</HEAD>
<BODY>
<FONT SIZE="6" FACE="MS 明朝" COLOR="#FF0000">私のホームページ</FONT>
</BODY>
</HTML>
- 次は「スタイル」の「太字」と「斜体」を指定するタグ <B><I> と </I></B> を「私のホームページ」の前後に記述します。
<HTML>
<HEAD>
<TITLE>初めてのホームページ</TITLE>
</HEAD>
<BODY>
<FONT SIZE="6" FACE="MS 明朝" COLOR="#FF0000"><B><I>私のホームページ</I></B></FONT>
</BODY>
</HTML>
- 入力が終わったら、→「ファイル」→「上書き保存」とクリックして、→「メモ帳」を閉じます。
- ブラウザの「更新」アイコンをクリックします。文字が変わりましたか?
文字が大きくなり、書体が変わり、赤い色になったでしょう。
では、フォントを指定するタグの説明をしましょう。
| サイズ | SIZE=" の次に 1 から 7 までの数字を入れ、" で閉じます。
1 が最小、3 が標準、7 が最大です。サイズの指定をしなければ 3 で表示されます。 |
| 書体 | FACE="MS 明朝" のように FACE=" の後に 書体名を入れ、" で閉じます。
あなたのパソコンにインストールされているフォントは、「メモ帳」の「メニューバー」の「編集」→「フォントの設定」とクリックすると、→「フォント名」欄に表示されます。
指定したフォントがホームページを見る人のパソコンにインストールされていない場合は他の書体で表示されます。使用する書体は一般的なものを指定しましょう。 |
| 色 | COLOR="#FF0000" のように"#"の後に6桁の英数字(16進数)を入れ、" で閉じます。
カラーサンプルは、ここをクリックしてご覧ください。
16進数の説明は、ここをクリックしてご覧ください。
COLOR="red" のように英語の色名でも指定できます。この場合は頭の # は不要です。 |
| スタイル | <FONT SIZE="5" FACE="MS 明朝" COLOR="#D5008B"><B><I>私のホームページ</I></B> のように表示する文字を <I> と </I> で囲います。
<B>太字</B>
<I>斜体</I>
<U>アンダーライン</U>
<FONT SIZE="6" FACE="MS 明朝" COLOR="#FF0000"><B><I><U>「私のホームページ」</U></I></B></FONT> のように複数のスタイルタグを用いることができます。 |
文字のサイズ、書体、色、スタイルを、いろいろと変えて表示してみましょう。