<cite></cite>

更新日
仕様 HTML Living Standard
分類 フロー・コンテンツ / フレージング・コンテンツ / パルパブル・コンテンツ
利用場所 フレージング・コンテンツが置ける場所
内容 フレージング・コンテンツ

cite要素は、作品のタイトルを表します。


<cite>作品のタイトルを表します</cite>

cite要素は、ある作品について述べる場合に、その作品のタイトルを示す目的で使用します。また、引用元のタイトルを示す際にも使用することができます。

作品の例としては、書籍、映画、ゲーム、絵画、論文、Webサイト、展覧会、SNSの投稿、などが挙げられます。


次の例では、作品について言及する際に、その作品のタイトルをcite要素で示しています。

<p>私の好きな肖像画は<cite>モナ・リザ</cite>です。昔、この作品が日本に ...</p>

次の例では、引用元のサイト名を示しています。

<p><cite>TAG index</cite>には、<q>作品のタイトルを表します。</q>と書かれていました。</p>

次の例では、Webページのタイトルを示しつつ、引用元へリンクしています。

<blockquote>
<p>cite要素は、ある作品について述べる場合に、その作品のタイトルを示す目的で使用します。また、引用元のタイトルを示す際にも使用することができます。</p>
</blockquote>

<p>引用元:<a href="https://www.tagindex.com/ ..."><cite>HTML[cite要素]作品のタイトルを表す - TAG index</cite></a></p>
  • Webページの場合、どこまでがタイトルなのかが微妙な時があります。上記の例では、title要素の内容をそのままタイトルとしていますが、サイト名(- TAG index)を取り除くなどして短くまとめた方が良いのかもしれません。

要素の内容について

cite要素の内容には、作品のタイトルのみを含めることができます。以前は作者名やURLを含めることができましたが、現行のHTMLではそれらを含めてはなりません。

そのため、次のようなケースでは作者名をcite要素の外に出しておく必要があります。

<p>私の好きな肖像画は「<cite>モナ・リザ</cite> by レオナルド・ダ・ヴィンチ」です。昔、この作品が日本に ...</p>

要素のデフォルトスタイル

一般的なブラウザでは、この要素内のテキストはイタリック体で表示されます。

  • フォントによっては、イタリック体で表示されない場合があります。
作品のタイトル Citation
旧HTMLからの変更点
  • HTML5:要素の定義が変わりました。(引用元 → 作品のタイトル、作者名、URL)
  • HTML5:引用時だけでなく、言及のみの場合にも使用できるようになりました。
  • HTML LS:要素の定義が変わりました。(作品のタイトル、作者名、URL → 作品のタイトル)

使用例

ゲーム作品のタイトルを示した例

<p>私がはまったゲームは、<cite>信長の野望</cite><cite>提督の決断</cite><cite>シヴィライゼーション</cite>の3つです。この作品たちのために、一体どれだけの時間を費やしてしまったのだろう…。</p>

表示例

私がはまったゲームは、信長の野望提督の決断シヴィライゼーションの3つです。この作品たちのために、一体どれだけの時間を費やしてしまったのだろう…。

引用元のタイトルを示した例

<p><a href="https://www.tagindex.com/html/text/cite.html"><cite>TAG index</cite></a>では以下のように説明されていました。</p>

<blockquote>

<p>cite要素は、ある作品について述べる場合に、その作品のタイトルを示す目的で使用します。また、引用元のタイトルを示す際にも使用することができます。</p>

</blockquote>

表示例

TAG indexでは以下のように説明されていました。

cite要素は、ある作品について述べる場合に、その作品のタイトルを示す目的で使用します。また、引用元のタイトルを示す際にも使用することができます。