TOPページ >  文字を修飾する(書体、色、大きさなど...) > 文字の大きさを指定する(スタイル指定)

文字の大きさを指定する(スタイル指定)

ホームページやブログなどのウェブサイトで 文字の大きさを変えたい時は、style指定が便利です。ピクセル値などの絶対サイズで細かく指定したり、LARGER/SMALLERなどのキーワードで他の文字より一段大きく/小さくなど相対的に指定したりできます。

e3.gif n4.gif
<タグ名 style="font-size:文字の大きさ">大きさを指定する文字</タグ名>
  1. タグ名:PやDIV、SPANタグなどが一般的ですが、他にもほとんどのインラインタグおよびブロックタグが使用できます。
  2. 文字の大きさ: 文字の大きさは、下記の絶対サイズ、相対サイズまたはキーワードから指定することができます。
    絶対サイズ意味
    inインチ( 1 in = 25.4 mm )
    cmセンチメートル
    mmミリメートル
    ptポイント( 1 pt = 1/72 in)
    pcパイカ( 1 pc = 12 pt )
    pxピクセル(表示上の 1 ドット幅)
    相対サイズ意味
    em基準書体の文字の高さ
    ex基準書体の文字 x の高さ
    %基準書体のサイズに対する百分率
    ※正確にはデバイス依存の相対サイズ
    絶対サイズ
    キーワード
    文字の大きさ
    xx-small超特小
    x-small特小
    small
    medium標準
    large
    x-large特大
    xx-large超特大
    相対サイズ
    キーワード
    文字の大きさ
    smallerより小さく
    largerより大きく

サンプルです。

例えば下記の文で、『東京ディズニーランド』を 18ピクセルの大きさで表示するとすると、

先週の日曜日に、<span style="font-size:18px;">東京ディズニーランド</span>へ行きました。

こんな感じが一番使いやすいと思います。これをブログの投稿欄にそのまま入力すると、こんなふうに部分的に文字の大きさを変えることができます。

先週の日曜日に、東京ディズニーランドへ行きました。

各キーワードで指定した場合のサンプルはこちら。

<div style="font-size:xx-small">超特小xx-smallです。</div>
<div style="font-size:x-small">
特小x-smallです。</div>f
<div style="font-size:small">
小smallです。</div>
<div style="font-size:medium">
標準mediumです。</div>
<div style="font-size:large">
大largeです。</div>
<div style="font-size:x-large">
特小x-largeです。</div>
<div style="font-size:xx-large">
超特大xx-largeです。</div>
<div style="font-size:smaller">
より小さくsmaller(相対サイズ)です。</div>
<div style="font-size:larger">
より大きくlargeer(相対サイズ)です。</div>

このソースを表示させると、次のようになります。

超特小xx-smallです。
特小x-smallです。
小smallです。
標準mediumです。
大largeです。
特小x-largeです。
超特大xx-largeです。
より小さくsmaller(相対サイズ)です。
より大きくlargeer(相対サイズ)です。

文字の大きさを指定するには、FONTタグの size オプションを指定する方法もあります。詳しくは→文字の大きさを指定する(FONTタグ)

ランキングに参加中です! お役に立てたらクリックをお願いします→

同一カテゴリ内一覧
文字の大きさを指定する(FONTタグ)
文字の修飾方法を指定する
文字を点滅させる
ルビ(ふりがな)の位置揃えを指定する
ルビ(ふりがな)の表示位置を指定する
文字にルビ(ふりがな)を付ける
文章の一部にスタイルを適用する
文字を等幅文字にする
文章の書体、サイズ、行の高さ、スタイルをまとめて指定する
文章の書体を指定する(スタイル指定)
文章の段落を指定する
文字をイタリック/斜体にする
文字の書体を指定する(専用タグ)
文字に下線をつける(アンダーライン)
文字を見え消しにする(取消線)
文字を強調する
文字の太さを指定する
文字を太字にする
上付き/下付き文字にする
文字の色を変える
文字を一段大きく/小さくする
文字の大きさを指定する(スタイル指定)
IEの方はこちらから当サイト ブックマークできます。
ランキング参加中!お役に立てたら クリックをお願いします。
当サイト掲載カテゴリは
Yahoo! JAPAN コンピュータとインターネット > データ形式 > HTML > リファレンス