閉じる
カテゴリー
もっと見る:HTML&CSSコーディング

HTML&CSSコーディング
テキストを強調する

HTMLには、入力したテキストを部分的に装飾したり、強調したりするためのタグも用意されています。

適度に装飾することで、プレーンなテキストよりも、ずっと読みやすくなります。

太字にするbタグ

<b></b>タグで囲ったテキストは、太字で表示されます。

bは英語のbold(太い)に由来します。

ただ、表示されるテキストは、文字どおり太いだけであって、重要性を表すニュアンスはありません。あくまで、太く目立たせるものとして使います。

HTML <p><b>HTML</b>と<b>CSS</b>が記述できれば、一からウェブサイトを構築できます。</p>
DEMO

重要性を表すstrongタグ

重要であることを示したい場合は、<strong></strong>タグでテキストを囲います。

文字通り英語のstrong(強い)のニュアンスがあります。

訪問者に対してだけではなく、検索エンジン(のクローラー)に対しても、そのテキストが重要である(キーワードになっている)ことを伝えるべきなので、bタグとstrongタグは使い分けたほうが好ましいです。

HTML <p>プログラミングができると<strong>就職に有利</strong>です。</p>
DEMO

マーカーのmarkタグ

テキストを<mark></mark>タグで囲うと、マーカーをひくことができます。

見た目としては、蛍光ペンをひいたような感じになります。

HTML <p>会社を辞めて独立するには、経理や税務など<mark>プログラミング以外の知識も必要になる</mark>のが一般的です。</p>
DEMO

その他テキスト装飾用タグ

ひとまず、テキストを装飾したり強調したりするには、bタグ、strongタグ、markタグがあれば十分ですが、他にも次のようなテキスト装飾用のタグがあります。

<i></i>タグはイタリック体(italic type)で、平たくいうと斜体です。しかし、原則的に日本語では斜体は使わないので、あまり使わないかもしれません。

<u></u>タグはアンダーライン(underline)で、囲ったテキストには下線がつきます。ただ、通念的に下線=リンクなので、ユーザーが誤解しないよう、使うべきではないというのが一般的です。

さらに、強調を表す<em></em>タグというのもあります。英語のemphasis(強調)に由来します。strongタグとの違いわかりづらく、またデフォルトでは斜体になるので、はじめはstrongタグで強調しておけば問題ありません。

HTML/CSS一覧