MB-Support

パソコン初心者のサポートページ

文字サイズを指定する <font size="1">

 フォントサイズ(文字の大きさ)を変更する方法は絶対値( 1 〜 7 )の指定方法、基準値(3)からの相対値を指定する方法、スタイルを埋め込んで px ( ピクセル ) 単位で指定する方法があります。




絶対値による指定

フォントサイズを指定する事により、文字サイズを変更できます。 <font size="1"> 〜 </font> の間に文字を入力して、size を 1 〜 7 まで指定できます。指定が無い場合は基準値の3になります。

HTMLソース(メモ帳)

<html>
<head>
<title>題名</title>
</head>
<body>
<p>
<font size="1">フォントサイズ</font><br/>
<font size="2">フォントサイズ</font><br/>
<font size="3">フォントサイズ</font><br/>
<font size="4">フォントサイズ</font><br/>
<font size="5">フォントサイズ</font><br/>
<font size="6">フォントサイズ</font><br/>
<font size="7">フォントサイズ</font><br/>
<font>フォントサイズ</font><br/>
フォントサイズ<br/>
</p>
</body>
</html>

ブラウザ


応用編

1文字づつサイズを変えて見ました。

HTMLソース(メモ帳)

<html>
<head>
<title>題名</title>
</head>
<body>
<p>
 <font size="7">シ</font>
 <font size="6">ャ</font>
 <font size="5">ー</font>
 <font size="4">ロ</font>
 <font size="3">ッ</font>
 <font size="2">ク</font>
 <font size="1">・</font>
 <font size="7">ホ</font>
 <font size="6">ー</font>
 <font size="5">ム</font>
 <font size="4">ズ</font>
 </p>
</body>
</html>

ブラウザ


相対値による指定

基準となる文字サイズ 3 より、大きいか小さいかを数字で指定します。フォントサイズが 1 〜 7 までなので、基準を 3 とした場合、マイナス(小さく)で指定できる数字は、

-2(基準 3 - 2 = 1 [ フォントサイズの最小値 ] )
-1(基準 3 - 1 = 2)

の 2 つとなります。

一方、プラス(大きく)で指定できる数値は、

+1(基準 3 + 1 = 4)
+2(基準 3 + 2 = 5)
+3(基準 3 + 3 = 6)
+4(基準 3 + 4 = 7 [ フォントサイズの最大値 ] )

の 4 つになります。

HTMLソース(メモ帳)

<html>
<head>
<title>題名</title>
</head>
<body>
<p>
<font size="-2">フォントサイズ</font><br/>
<font size="-1">フォントサイズ</font><br/>
<font>フォントサイズ (基準 3)</font><br/>
<font size="+1">フォントサイズ</font><br/>
<font size="+2">フォントサイズ</font><br/>
<font size="+3">フォントサイズ</font><br/>
<font size="+4">フォントサイズ</font><br/>
</p>
</body>
</html>

ブラウザ


基準値と相対値による指定

上の相対値の指定では、基準値 3 からの相対値の指定になりますが、この基準値も変更する事が可能です。 下の例では、基準値を 4 に変更しています。このため、マイナスは - 3 (絶対値 1)まで指定可能になり、プラスは + 3 (絶対値 7)までの指定と変更されます。

HTMLソース(メモ帳)

<html>
<head>
<title>題名</title>
</head>
<body>
<basefont size="4">
<p>
<font size="-3">フォントサイズ</font><br/>
<font size="-2">フォントサイズ</font><br/>
<font size="-1">フォントサイズ</font><br/>
<font>フォントサイズ (基準 4)</font><br/>
<font size="+1">フォントサイズ</font><br/>
<font size="+2">フォントサイズ</font><br/>
<font size="+3">フォントサイズ</font><br/>
</p>
</body>
</html>

ブラウザ


スタイルシート

今までの指定方法とは、根本的に異なってしまいますが、タグにスタイルを挿入する事で、絶対値の最大フォントサイズ( 7 )よりも大きく表示できます。

HTMLソース(メモ帳)

<html>
<head>
<title>題名</title>
</head>
<body>
<p style="font-size:100px">MB</p>
<p style="font-size:100pt">MB</p>
<p style="font-size:1000%">MB</p>
</body>
</html>

ブラウザ


追記:知恵袋で勝手に話題にされ、回答者に酷い言われをしているので追記しておきます。この日記はデータベースに登録したのが 2005 年で、公開したのは2003年になります。 「現在そのタグは廃止予定となっているからです。」とありますが、2003年の時点で廃止予定になっています。 「数年のうちにHTML5が勧告される予定ですが、そうなれば<font>タグは廃止となります。」とありますが、これもその通りだと思います。 もちろん、2003年からそう言われていました。<font>タグがいつまで利用できるか分かりませんが、正確にはブラウザがいつまでサポートするかの問題で、<font>タグは使わない方が無難です。 しかし、このページはHTMLのページです。ここを勘違いしないで下さい。後半はスタイルシートでフォントサイズを指定するやり方を掲載してあります。 これは、<font>タグと同じく、気軽に使えるからです。しかし、WEBデザイナーになるならば、HTMLタグに直接挿入するCSSの使い方も問題があります。 CSSに関しては、以下のカテゴリに掲載していますが、まだフォントサイズの指定まで作成しておりません。

スタイルシート CSS - MB-Support




戻る 一覧表示 次へ


BTOパソコン・ゲームPC・自作パソコンなら【TSUKUMO】 - 自作PCに必要なパーツ、豊富な品揃え

Copyright © 2013 MB-Support パソコン初心者のサポートページ All Rights Reserved.

管理人サイト閲覧方法プライバシーポリシー著作権/免責事項