A.T-MOON

contents

パンくずリスト

メッセージエリア



フォントの指定(HTMLタグ編)

メッセージエリア


<要素 フォント関連の属性="属性の値">〜</要素>が基本的な形となります。
このタグを使って指定要素のフォントを指定していきます。

HTMLタグでの背景関連の属性
  • size … フォントのサイズの指定
  • face … フォントの種類の指定
  • color … フォントの色の指定
  • text … フォントの色の指定(body要素に対して有効)

文字のサイズ

<font size="A">〜</font>


Aには1〜7の数字が入ります。数字のみを半角で入れます。(絶対値指定)
基本サイズは"3"なので"2"や"1"はそれより小さく"4"や"5"はそれより大きく表示されます。
又プラス、マイナスで表示する(相対値指定)こともできます。
基本サイズが"3"なので"-1"だと"2"の大きさで、"+2"だと"5"の大きさでといった具合に。
ただし相対値指定は表示されるブラウザに依存しますので注意してくださいね。

これがサイズ1≠フ"MSゴシック"文字です
これがサイズ2≠フ"MSゴシック"文字です
これがサイズ3≠フ"MSゴシック"文字です
これがサイズ4≠フ"MSゴシック"文字です

<html>
 <head>
  <title>文字のサイズ指定</title>
 </head>
 <body>
 <font size="2">
 これがサイズ2の文字です
 </font>

 <font size="+1">
 基本サイズ3に1≠プラスしたサイズ4の文字です
 </font>

 </body>
</html>
↓ピンクの部分のタグをコピー↓
<body>〜</body>の間の表示したいところに記述して下さい
ページTOP
ひとつ前のページに戻る


文字の種類

<font face="A">〜</font>


Aには文字の種類が入ります。
様々な種類がありますので色々参考にしてみて下さい。 →フォント表
フォントの種類は複数指定することができ、<font face="A,B,C">という風に
A=第一候補、B=第二候補、C=第三候補という具合にカンマで区切り表記します。

フォントの種類で注意しなくてはいけない事は、指定したフォントが相手のパソコンにあるかどうかです。
自分のパソコンには入っていて表示される文字でも
閲覧する相手のパソコンに入っていないフォントではコチラの指定した文字では表示されません。
フォントを指定しなかったり、指定したフォントが相手にない場合は
使用ブラウザに設定されたデフォルトのフォントで表示されることになります。

MSゴシック
Comic sans MS
明朝体
MS UI Gothic
Verdana

<html>
 <head>
  <title>文字の種類指定</title>
 </head>
 <body>
 <font face="MS ゴシック">
 これがMSゴシック文字です
 </font>

 <font face="MS P明朝">
 これが明朝体文字です
 </font>

 </body>
</html>
↓ピンク部分のタグをコピー↓
<body>〜</body>の間の表示したいところに記述して下さい
ページTOP
ひとつ前のページに戻る


文字の色(全体に指定)

<body text="A">〜</body>


Aにはカラーコードかカラーネームが入ります。
カラーコード
#≠ノ続けて、赤(r)、緑(g)、青(b)の値を00〜ffの16進数計6桁で表します。
例えば白なら#ffffff=A黒なら#000000≠ニいうふうに記述します。
全て覚えるのは大変ですのでカラーチャートなどを参考にするとよいでしょう。

カラーネーム
文字通り色の名前≠ナ表します。
例えば白ならwhite=A黒ならblack≠ニいうふうに記述します。
大文字小文字の区別はありません。
<html>
 <head>
  <title>ページ全体の文字色の指定</title>
 </head>
 <body text="gray">
 ページ全体の文字の色がグレイに指定されています
 </body>
</html>
という具合に<body>タグの中にtext="色の指定"を追記するだけです。
ページTOP
ひとつ前のページに戻る


文字の色(部分的に指定)

<font color="A">〜</font>


Aにはカラーコードかカラーネームが入ります。
カラーコード
#≠ノ続けて、赤(r)、緑(g)、青(b)の値を00〜ffの16進数計6桁で表します。
例えば白なら#ffffff=A黒なら#000000≠ニいうふうに記述します。
全て覚えるのは大変ですのでカラーチャートなどを参考にするとよいでしょう。

カラーネーム
文字通り色の名前≠ナ表します。
例えば白ならwhite=A黒ならblack≠ニいうふうに記述します。
<html>
 <head>
  <title>文字色を指定</title>
 </head>
 <body>
 <font color="#000000">
 黒の文字です
 </font>

 <font color="pink">
 ピンクの文字です
 </font>

 </body>
</html>
赤色の文字

青色の文字

緑色の文字

ピンクの文字

何も指定されていない部分はデフォルトです。
全体の文字色を指定する場合は<body>タグに指定するかスタイルシートを使いましょう。
ページTOP
ひとつ前のページに戻る


文字をまとめて指定

<font size="A" face="B" color="C">〜</font>


ABCにはそれぞれの属性の値が入ります。

サイズ3、明朝体、緑色の文字です

<html>
 <head>
  <title>文字をまとめて指定</title>
 </head>
 <body>
 <font size="3" face="MS P明朝" color="green">
 サイズ3、明朝体、緑色の文字です
 </font>

 </body>
</html>
↓ピンク部分のタグをコピー↓
<body>〜</body>の間の表示したいところに記述して下さい

文字の指定にはHTMLタグでの他にスタイルシートでも指定することができます。
スタイルシートの章も参考にしてみて下さい。
ページTOP
ひとつ前のページに戻る
HTML TOP前のページ 次のページフォントの装飾 1