ゼロからはじめるホームページ作成 
HOME > スタイルシート講座 > 文字の太さを設定する

文字の太さを設定する

font-weightで文字を装飾することができます。

100〜900までの数字で設定する方法と、boldなどのキーワードを指定する方法があります。
100が一番細く、900が一番太い設定で、400が標準の太さの設定です。
100〜900の9種類がありますが、ブラウザによっては太さが変わらない場合もあります。

また、キーワードにはnormal(普通)、bold(太い)、bolder(現在より1段階太い)、lighter(現在より1段階細い)があります。

一般的にboldを使います。

<div style="font-weight:100">100の設定</div>
<div style="font-weight:200">200の設定</div>
<div style="font-weight:300">300の設定</div>
<div style="font-weight:400">400の設定</div>
<div style="font-weight:500">500の設定</div>
<div style="font-weight:600">600の設定</div>
<div style="font-weight:700">700の設定</div>
<div style="font-weight:800">800の設定</div>
<div style="font-weight:900">900の設定</div>
<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>

結果

100の設定
200の設定
300の設定
400の設定
500の設定
600の設定
700の設定
800の設定
900の設定
normalの設定
boldの設定
bolderの設定
lighterの設定

まとめ

  • 文字の装飾はtext-decorationで設定する。
  • 00〜900までの数字で設定する方法と、boldなどのキーワードを指定する方法がある。


スタイルシート講座

初心者講座

スポンサードリンク

スタイルシート辞典

テキスト
フォント
背景
ボックス
配置
リスト
テーブル
ユーザインタフェース
その他



Copyright© ゼロからはじめるホームページ作成講座 All Rights Reserved.  サイトマップ