スタイルシートマニア

文字のウエイトで強調表示 | ホームページカスタマイズ Tips

文字を太くするには、font-weightプロパティでウエイトの値を指定します。

一般的によく使われる値は「bold」。それ以外では、「bolder」(現在のウエイトよりも1つ太いもの)や「lighter」(現在のウエイトより1つ細いもの)で、現在の太さに対して一段階ウエイトを変化させます。

h1 {
      font-weight: bold;
}

h2 {
      font-weight: bolder;
}
h3 {
      font-weight: lighter;
}

bold

bolder

lighter

後ほとんど使わないですが、「100」「200」「300」っといった感じで100刻みで900までを使って太さを指定できます。

標準(nomal)の値が400
boldの値が700

になります。

文字を装飾表示するhtmlタグで<b>タグや<strong>タグ<em>タグなどがありますが、これらのタグは非推奨要素になっていたり、装飾目的で使用すると間違った文章構造になってしまいますので注意が必要です。
ちなみに、<b>タグはCSSによる設定を推奨されています。他にも、<u><s><strike>などは、非推奨要素になっています。<strong>タグ<em>タグも検索ロボットにキーワードをアピールする目的で使用するので、装飾目的のみで使用するのであれば新たにCSSを作成しましょう。

Author:庄野英朗
Comments:0

庄野英朗

Source Marine 代表
デザイン・コーディング・PHPアプリケーションまでこなす。
マルチデザインプログラマ。

コメントを残す