文字の太さを指定する
ホームページやブログなどのウェブサイトで文章を表示させる際に、文字の太さを指定することができます。
<タグ名 style="font-weight:文字の太さ">太さを指定する文字</タグ名>
- タグ名：PやDIV、SPANタグなどが一般的ですが、他にもほとんどのブロックタグやインラインタグが使用可能です。
- 文字の太さ：下記のキーワードまたは数値で指定できます。
キーワード 文字の太さ normal 通常 bold 太字 bolder より太く lighter より細く 数値 100（細い）～900（太い）
※100刻みで指定
サンプルソースです。
<div style="font-weight:normal">
この文字は、normal（普通）です。</div>
<div style="font-weight:bold">
この文字は、bold（太字）です。</div>
<div style="font-weight:bolder">
この文字は、bolder（より太く）です。</div>
<div style="font-weight:lighter">
この文字は、lighter（より細く）です。</div>
<hr>
<div style="font-weight:100"> この文字は、太さ100です。</div>
<div style="font-weight:300"> この文字は、太さ300です。</div>
<div style="font-weight:500"> この文字は、太さ500です。</div>
<div style="font-weight:700"> この文字は、太さ700です。</div>
<div style="font-weight:900"> この文字は、太さ900です。</div>
この文字は、normal（普通）です。</div>
<div style="font-weight:bold">
この文字は、bold（太字）です。</div>
<div style="font-weight:bolder">
この文字は、bolder（より太く）です。</div>
<div style="font-weight:lighter">
この文字は、lighter（より細く）です。</div>
<hr>
<div style="font-weight:100"> この文字は、太さ100です。</div>
<div style="font-weight:300"> この文字は、太さ300です。</div>
<div style="font-weight:500"> この文字は、太さ500です。</div>
<div style="font-weight:700"> この文字は、太さ700です。</div>
<div style="font-weight:900"> この文字は、太さ900です。</div>
このソースを表示させると、次のようになります。
この文字は、normal（普通）です。
この文字は、bold（太字）です。
この文字は、bolder（より太く）です。
この文字は、lighter（より細く）です。
この文字は、太さ100です。
この文字は、太さ300です。
この文字は、太さ500です。
この文字は、太さ700です。
この文字は、太さ900です。
デフォルトの設定が通常あまり太くありませんから、細くする指定をしても違いがわかりにくいかも知れません。
単に太字で表示させたい場合は、専用タグによる方法もあります。→文字を太字にする
ランキングに参加中です! お役に立てたらクリックをお願いします→
同一カテゴリ内一覧
コンピュータとインターネット > データ形式 > HTML > リファレンス