HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

HTMLで強調フォーマットを使う方法｜emタグの基本と使い方をわかりやすく解説

HTMLの強調フォーマットとは？

HTMLでテキストを強調表示するには、<em>〜</em> タグを使用します。このタグは、囲まれたテキストが「強調（emphasis）」であることを示すものであり、単に見た目を変えるだけでなく、意味的な重要性もブラウザやスクリーンリーダーに伝えます。

<em> はフレーズタグ（phrase tag）に分類され、多くのブラウザではデフォルトでイタリック体（斜体）として表示されます。ただし、見た目だけの装飾目的ならCSSでのスタイル指定が適切であり、<em> は「文脈上強調したい箇所」に使うのがセマンティックHTMLの正しい使い方です。

基本的な構文

<p>これは<em>強調されたテキスト</em>です。</p>

emタグの使用例

以下のコードを実行すると、HTMLで <em>〜</em> タグを使った強調フォーマットの動作を確認できます。

サンプルコード

<!DOCTYPE html>
<html>
    <head>
        <title>HTML emタグの例</title>
    </head>

    <body>
        <h1>チュートリアル</h1>
        <p><em>ウェブサイト開発</em>を簡単に学びましょう。</p>
    </body>
</html>

出力結果

上記コードをブラウザで開くと、「ウェブサイト開発」の部分がイタリック体で強調表示されます。これにより、読者に対してその部分が特に重要であることが視覚的にも伝わります。

strongタグとの違い

<em> とよく比較されるタグに <strong> があります。両者の違いは以下の通りです。

  • <em>タグ： 文中の特定の語句を「強調」したい場合に使用。通常は斜体で表示される。
  • <strong>タグ： 内容の「重要性・緊急性」を示す場合に使用。通常は太字で表示される。

適切に使い分けることで、検索エンジンや支援技術にも正しく情報が伝わり、よりアクセシブルなWebページを作成できます。

  1. HTMLのmultiple属性とは？複数選択を可能にする使い方を徹底解説

    HTMLのmultiple属性は、ユーザーが複数の値を選択・入力できるようにするための属性です。この属性はブール型（真偽値）属性であり、<input>要素と<select>要素の両方で使用できます。特に、HTMLフォームで複数のファイルをアップロードしたい場合にmultiple属性が活躍します。また、この属性は「email」および「file」タイプの入力フィールドに対応しています。multiple属性の主な特徴fileタイプ：ファイル選択ダイアログで複数のファイルを同時に選択可能になります（CtrlキーやShiftキーを押しながらクリック）。emailタイプ：カンマ区切

  2. HTMLのlist属性とは？datalist要素で入力候補を表示する方法を解説

    HTMLのlist属性とはHTMLでは、<datalist>要素を使用して、あらかじめ定義された選択肢のリストを作成できます。このリストは<input>要素（入力欄）に対して適用され、ユーザーが文字を入力すると、定義済みの選択肢が候補として自動的に表示されます。<input>要素のlist属性は、対応する<datalist>要素のidを参照することで、入力欄と選択肢リストを関連付けます。このlist属性は、HTML5で新たに導入された機能です。list属性の基本的な使い方list属性を使うには、以下の2つのステップを行います。<datali