やまでら くみこ のレシピ

短時間で簡単に作れる人気家庭料理を紹介。

HTMLタグとCSSで太字表示する3つの方法。

投稿日:2015年9月11日 更新日:

ブログを書くときなどに、HTMLタグやスタイルシートでテキストを太字にする方法をご紹介します。
一番シンプルなのは、<b>タグを使う方法。

他にもいくつか方法があるので、あわせてご紹介します。

<b>タグ

まずは、冒頭でご紹介した<b>タグを使う方法。

<b>HTML、CSSで太字</b>

【表示例】HTML、CSSで太字

<strong>タグ

続いて<strong>タグを使う方法。

<strong>HTML、CSSで太字</strong>

【表示例】HTML、CSSで太字

見た目は<b>タグと変わりませんが、こちらは文字を「強調」したい場合に使用します。

<b>タグは単なる太字表示。<strong>タグは強調表示。
とは言いつつも、あんまり気にしなくていいと思います。
ちなみに私は<strong>をいつも使っています。

CSS

最後は、CSSで太字表示する方法です。
font-wightプロパティにboldを指定します。

タグにスタイルシートを設定する場合。

<span style="font-weight:bold;">HTML、CSSで太字</span>

こちらは、ヘッダー部分にスタイルシートを記述する場合。

<style type="text/css">
span.bold-text {
font-weight:bold;
}
</style>
<span class="bold-text">HTML、CSSで太字</span>

見た目は、どちらもこうなります。
【表示例】HTML、CSSで太字

おすすめ記事

最小公倍数の計算アプリ。手計算する場合の簡単な求め方も紹介。

最小公倍数を求めるための計算機アプリです。整数は、3つ以上入力すること…

最大公約数の計算機。サイト上で瞬時に計算!簡単な求め方も解説。

最大公約数を求めるための計算機アプリです。整数は、3つ以上入力すること…

フランス語のアルファベットの簡単キーボード。一覧から文字を入力。

フランス語のアルファベットを簡単に入力するためのオンラインアプリです。…

スペイン語のアルファベット入力キーボード。変換不要!一覧から文字を選択

スペイン語のアルファベットを簡単に入力するためのオンラインアプリです。…

ロシア語のアルファベット入力キーボード。変換不要!一覧から文字を選択

ロシア語のアルファベットを簡単に入力するためのオンラインアプリです。一…

累乗・べき乗の計算機。指数が分数・小数・マイナスでもOK!

累乗とべき乗(冪乗)を簡単に計算する電卓です。数aのn乗、anを算出し…

正三角形の面積・高さ・辺の長さの計算機。公式を使った求め方も紹介。

正三角形の面積・高さ・辺の長さを計算するツールです。

円の面積・直径・半径・円周の計算機。公式を使った求め方も紹介。

円の面積と円周の長さを計算するツールです。

トルコ語のアルファベットの入力ツール。トルコ文字の簡単キーボード。

トルコ語のアルファベットを入力するためのオンラインツールです。使い方は…

ギリシャ文字への変換を簡単に!見た目と読み方の一覧からギリシャ語を入力。

ギリシャ文字を手軽に入力するためのオンラインツールです。入力したいギリ…

ページ内リンクのジャンプ先がずれる原因と解決方法【HTML】

ページ内リンクのジャンプ先がずれてしまう原因と、その解決策について解説…

平方根(ルート)の値を求める計算機。分数もOKな電卓サイト。

平方根(ルート)の計算機は、平方根の値をサイト上でカンタンに計算できる…

【文字数カウント】いちどに複数の文章をチェックできるWebアプリ。

文字数カウンター/文字数チェッカーを作りましたので、サイト運営に役立て…

台形の面積 計算機。基本公式と高さが分からないときの求め方。

「台形の面積」計算機は、台形の面積をWeb上でカンタンに計算できる電卓…

HTMLタグとCSSで太字表示する3つの方法。

ブログを書くときなどに、HTMLタグやスタイルシートでテキストを太字に…