mark要素

mark要素は、他のコンテキストとの関連性に基づき、参照のためにマーク、もしくは、ハイライト表示する要素。

カテゴリー フロー・コンテンツフレージング・コンテンツ、パルパブル・コンテンツ。
コンテキスト フレージング・コンテンツを内包できる要素内で使用できる。
コンテンツ・モデル フレージング・コンテンツを内包できる。
属性 グローバル属性
ブラウザ対応

構文

<mark>ハイライト表示するテキスト</mark>

要点

  • mark要素は、他のコンテキストとの関連性に基づき、参照のためにマーク、もしくは、ハイライト表示する要素である。
  • ドキュメントにおける検索文字列を、ハイライト表示させるのにも、適している。
  • ほとんどのブラウザは、mark要素の背景色を黄色(#ffff00)にする。
  • mark要素は、HTML5にて新たに導入された要素である。

サンプルコード

他のコンテキストとの関連性に基づくハイライト表示

<p><cite>HTML5入門</cite>によると、</p>
<blockquote>
	<p><mark>ほとんどのブラウザ</mark>は、dfn要素内のテキストを、イタリック体で表示する。</p>
</blockquote>
<p>とある。</p>
<p>念のため、スタイルシートでイタリック体を指定することにした。</p>

検索文字列

検索文字列がHTMLである場合。

<p><mark>HTML</mark>5とは、<mark>HTML</mark>の5回目の大改訂版。</p>

サンプル

他のコンテキストとの関連性に基づくハイライト表示

HTMLソースコード
<p><cite>HTML5入門</cite>によると、</p>
<blockquote>
	<p><mark>ほとんどのブラウザ</mark>は、dfn要素内のテキストを、イタリック体で表示する。</p>
</blockquote>
<p>とある。</p>
<p>念のため、スタイルシートでイタリック体を指定することにした。</p>
実際の表示

HTML5入門によると、

ほとんどのブラウザは、dfn要素内のテキストを、イタリック体で表示する。

とある。

念のため、スタイルシートでイタリック体を指定することにした。

検索文字列

検索文字列がHTMLである場合。

HTMLソースコード
<b><samp><kbd>HTML</kbd></samp>の検索結果</b>
<p><mark>HTML</mark>5とは、<mark>HTML</mark>の5回目の大改訂版。</p>
<p><mark>HTML</mark>とは、ウェブドキュメントを記述するためのマークアップ言語である。</p>
実際の表示
HTMLの検索結果

HTML5とは、HTMLの5回目の大改訂版。

HTMLとは、ウェブドキュメントを記述するためのマークアップ言語である。