HPBUILD

Webページで文字を太く強調したいとき、どのように設定すれば良いのでしょうか？ CSSを使えば、簡単に見出しやキーワードを太字（bold）にすることができます。 この記事では、CSSによる太字指定の基本から、フォントウェイトの細かい調整方法まで、初心者にも分かりやすく解説していきます。 太字にするには「font-weight」を使う CSSでテキストを太字にするには、font-weightプロパティを使います。最もシンプルな指定方法は次のとおりです： .bold-text { font-weight: bold; } HTMLでは以下のように使います： <p class="bold-text">この文章は太字です。</p> font-weight: bold;は、実際にはフォントの太さを「700」に設定しているのと同じ意味になります。 数値での指定も可能 font-weightは、数値でも指定できます。代表的な例を以下にまとめます： 100：極細（thin） 300：細め（light） 400：標準（normal） 700：太字（bold） 900：極太（black） 例： .heavy-text { font-weight: 900; } ただし、使用するフォントによっては「400」と「700」の2段階しか効かないこともあります。 normalとboldを使い分けよう CSSでは、font-weightの値にキーワードも使えます： normal：通常の文字（=400） bold：太字（=700） bolder：親要素より太く lighter：親要素より細く bolderやlighterは、階層的なデザインをする際に便利です。 HTMLのタグだけでは不十分？ HTMLには<strong>や<b>タグもありますが、CSSでしっかり管理することで、スタイルの統一性が高まります。 <strong>この部分は重要です。</strong> このようにマークアップして、CSSで以下のように上書きすることも可能です： strong { font-weight: 600; } 文章構造（意味）と見た目の分離を意識しましょう。 フォントの種類によって太さは変わる フォントによっては「bold」が極端に太く見えたり、「900」指定が効かないこともあります。たとえば Google Fonts で読み込んだフォントでは、多くの太さバリエーションが用意されていることがあります。 @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700;900&display=swap'); body { font-family: 'Noto Sans JP', sans-serif; } このようにすれば、複数のウェイトを利用できるようになります。 まとめ font-weightを使えば、テキストの太さを自由に調整できます。キーワード（normal, bold）だけでなく、数値指定（100～900）を活用すれば、より細かなデザイン調整が可能になります。 見出し、強調、ボタンラベルなど、太字の使い方を意識することで、Webサイト全体のメリハリが生まれ、読みやすさが向上します。