HTML要素辞書 by Sentaro

マーク（Mark）要素。ドキュメント内の文脈から見て関連性の高いテキストをハイライト表示するために使用されます。

info

概要

 要素は、参照や文脈のために重要であるとマークされた、またはハイライトされたテキストを表します。
検索結果においてユーザーが検索したキーワードを強調表示したり、引用文の中で特に重要な部分を指摘したりする目的で利用されます。

play_circle

デモ (静的表示)

HTML (Source)

HTML要素の中で、最も重要な要素の一つです。 検索結果: 「マーク」要素について

Preview (Result)

HTML要素の中で、最も重要な要素の一つです。

検索結果: 「マーク」要素について

list

属性名	説明
（固有の属性なし）	`<mark>` 要素には、他の特定のHTML要素で定義されているような固有の属性はありません。
グローバル属性	全てのHTML要素に共通するグローバル属性（class, id, styleなど）は利用可能です。

code

1. 検索結果でのキーワード強調

<p>
 ユーザーが「Webデザイン」で検索しました。本記事では、
 <mark>Webデザイン</mark>の基本について解説しています。
</p>

2. 引用内の重要な部分の指摘

<blockquote>
 <p>
 ... 最初に考えるべきは、
 <mark>ユーザーの体験を第一に</mark>することであると彼は主張する。
 </p>
</blockquote>

3. 誤解されやすい箇所のハイライト

<p>
 注意:<mark>強調（<strong>）</mark>とは異なり、
 <mark>文脈的な関連性</mark>に基づいて使用されます。
</p>

lightbulb

info

と / の違い
 は、**文脈に応じて関連性が高い**ためにハイライトする際に使用します（例：検索キーワード）。
一方、 は**重要性**、 は**強調**（トーンの変化）を示すために使用され、意味的な違いがあります。

accessibility_new

アクセシビリティ
デフォルトのスタイル（黄色い背景）は、コントラスト比が低くなる可能性があるため、CSSで背景色や文字色を変更する場合は、**WCAGのコントラスト基準を満たしているか**を確認することが推奨されます。