作品や文献（サイト）のタイトルは、cite要素でマークアップしましょう。
cite要素の使い方
以下のプログラムと、ブラウザの表示結果を見てください。
<body>
<p>名作<cite>吾輩は猫である</cite>は、夏目漱石の代表作です。</p>
</body>
body要素の中に、「文のかたまり（段落）」を示すp要素があります。
p要素の中には、『名作吾輩は猫であるは、夏目漱石の代表作です。』と書かれた文章があります。
そして、「吾輩は猫である」と書かれたフレーズはcite要素でマークアップされています。
このため、ブラウザの表示結果の通り「吾輩は猫である」は斜体文字として表示されています。
英語（英文）ではどうなる？
では、英語（英文）についてcite要素でマークアップしてみましょう。
<body>
<p>名作<cite>吾輩は猫である</cite>は、夏目漱石の代表作です。</p>
<p>The masterpiece <cite>I am a Cat</cite> is one of Soseki Natsume's most famous works.</p>
</body>
先ほどのプログラムに、更にもう一行、英文を追加しました。
追加した英文では、「I am a Cat」についてcite要素でマークアップしてあります。
そして、ブラウザでの表示結果の通り「I am a Cat」は斜体文字として表示されています。
cite要素はカタカナにマークアップできるか？
さらに、カタカナ（全角、半角）についてcite要素でマークアップを行いました。
<body>
<p>名作<cite>吾輩は猫である</cite>は、夏目漱石の代表作です。</p>
<p>The masterpiece <cite>I am a Cat</cite> is one of Soseki Natsume's most famous works.</p>
<p>太宰治の<cite>走れメロス</cite>は、熱き友情の物語である。</p>
<p>太宰治の<cite>走れﾒﾛｽ</cite>は、熱き友情の物語である。</p>
</body>
先ほどのプログラムに、カタカナのテキストを含む文章を追加しました。
追加した文章では、「走れメロス」や「走れﾒﾛｽ」についてcite要素でマークアップしてあります。
そして、ブラウザの表示結果の通り、カタカナ（全角および半角）についても斜体文字のように表示できました。
cite要素は数字にもマークアップできるか？
数字についても、cite要素でマークアップしてみました。
<body>
<p>名作<cite>吾輩は猫である</cite>は、夏目漱石の代表作です。</p>
<p>The masterpiece <cite>I am a Cat</cite> is one of Soseki Natsume's most famous works.</p>
<p>太宰治の<cite>走れメロス</cite>は、熱き友情の物語である。</p>
<p>太宰治の<cite>走れﾒﾛｽ</cite>は、熱き友情の物語である。</p>
<p>映画<cite>２００１年宇宙の旅</cite>は、スタンリー・キューブリックが製作・監督したＳＦ映画である。</p>
<p>映画<cite>2001年宇宙の旅</cite>は、スタンリー・キューブリックが製作・監督したＳＦ映画である。</p>
</body>
先ほどのプログラムに、数字（全角数字、半角数字）のテキストを含む文を追加しました。
追加した文章では、「２００１年宇宙の旅」や「2001年宇宙の旅」についてcite要素でマークアップしてあります。
そして、ブラウザの表示結果の通り、カタカナ（全角および半角）についても斜体文字のように表示できました。
以上から、cite要素は、「全角文字」「半角数字」「英文字」「カタカナ（全角及び半角）」に対して、マークアップできることが確認できました。
【カテゴリー】パルパブル・コンテンツ、フロー・コンテンツ、フレージング・コンテンツ
cite要素が属するカテゴリーは、パルパブル・コンテンツ、フロー・コンテンツ、フレージング・コンテンツになります。
パルパブル・コンテンツに属する要素は、その要素の中にhidden属性が指定されていない要素を１つ以上含める必要があります。
また、フロー・コンテンツに属する要素は、body要素の中に記述される必要があります。フレージング・コンテンツに属する要素は、テキストをマークアップするために記述される必要があります。
つまり、cite要素は、以下のプログラムに示す通り、body要素の中においてテキストをマークアップするために記述され、cite要素の中にhidden属性が指定されていない要素を１つ以上含めるように記述する必要があります。
<body>
<p>モーツァルト作の歌劇「<cite>フィガロの結婚</cite>」は、初演が1786年です。</p>
</body>
cite要素は、上のプログラムに示す通り、body要素の中でマークアップしたテキストについて斜体文字のように表示するために、用いられることが求められます。
また、プログラムに示す通り、cite要素にhidden属性を指定することなく、cite要素の内容「フィガロの結婚」がブラウザに表示された状態とする必要があります。
【コンテンツ・モデル】フレージング・コンテンツ
cite要素のコンテンツ・モデルは、フレージング・コンテンツです。
フレージング・コンテンツに属する要素は、文章内のテキストをマークアップするための要素です。そして、ブラウザに表示される「テキスト」も、フレージング・コンテンツに属する要素と同じように扱うことができます。
つまり、コンテンツ・モデルをフレージング・コンテンツとする要素（例えばcite要素）は、その要素の中にフレージング・コンテンツに属する要素またはテキストを含めるように記述する必要があります。
このため、cite要素は、以下のプログラムに示す通り、cite要素の中にフレージング・コンテンツに属する要素（例えばstrong要素）を含めるように記述する必要があります。
<body>
<p>広く人気を集める名画<cite><strong>モナ・リザ</strong></cite>は、ルーブル美術館で見ることができます。</p>
</body>
上に示したプログラムでは、body要素の中のp要素において、「モナ・リザ」のフレーズがcite要素でマークアップされています。そして、cite要素の中において「モナ・リザ」のテキストがstrong要素でマークアップされています。
このため、ブラウザの表示結果の通り、「モナ・リザ」のフレーズについて、斜体文字のように表示されると共に重要性を付与した状態で表示することができています。
各種ブラウザでの表示結果
cite要素について、主要なブラウザにおけるサポート状況は、以下の通りです。
| Google Chrome | Microsoft Edge | Safari | Firefox | Opera | |
| 【cite要素】 | ○ | ○ | ○ | ○ | ○ |
以上、cite要素の使い方について、ご参考になさってください。