CSSで文字を太文字にする方法

太さを変えて文字を強調することは、よくありますよね。CSSでは文字の太さを変える方法も、知っておくと便利なものが幾つかあるので、覚えておいて損はないでしょう。基本としては、boldを使って太字にします。

boldで太文字を指定しよう

.sample1 {
	font-wight: bold;
}

記述の仕方は上記の通りです。また、bolderとlighterというスタイルもあります。これは相対的に文字の太さを変えるもので、bolderは相対的に太く。lighterは相対的に細くスタイリングが変わります。

.sample2 {
	font-wight: bolder;
}
.sample3 {
	font-wight: lighter;
}

もっと自分の思うように太さを変えたい! と思うこともあるかと思います。その場合は、100から900までの数値で自分の好きな太さを指定することができます。

しかし、この方法は100単位でしか対応してないので、思うようにとは言っても9段階が限度です。フォントの種類によっては対応している太さの種類が決まっているので、実際は9段階も変えれないものが多いでしょう。

数値で太さを指定したい場合の、記述の仕方は次の通りです。

.sample4 {
    font-weight:300;
}
.sample5 {
    font-weight:700;
}

文字の太さ指定のサンプル

1〜5までの表示のサンプルを載せておくので、参考にしてみてください。

css8

一番簡単なのは、boldですので、それだけでも覚えておくと便利だと思います。