4.1 <blockquote> エレメント
HTMLには特に引用のためのタグが存在していて、<blockquote>、<cite>、<q>があるよ。
それぞれのタグは特定の用途を持っていて、いろんな種類の引用や元のソースへのリンクに使われるんだ。
<blockquote> タグは、大きな引用ブロックを目立たせるために使われるよ。ブラウザは通常、引用をメインのテキストから分けて表示するために、左にインデントをつけて表示するんだ。
使用例:
<blockquote>
"The only limit to our realization of tomorrow is our doubts of today."
</blockquote>
特徴:
- ブロック要素であること
- 左インデントがよく付けられること
- 他のブロックやインライン要素を含めることができること
- 引用元のURLを示すためのcite属性を持てること
cite属性:
cite 属性は <blockquote> タグで使われ、引用のソースを示すために使われるよ。この属性は見た目に表示されないけど、引用の由来を保持するのに便利で、検索エンジンや他の自動テキスト処理システムにとって役立つんだ。
cite属性付きの例:
<blockquote cite="https://example.com/quote-source">
"The only limit to our realization of tomorrow is our doubts of today."
</blockquote>
4.2 <cite> エレメント
<cite> タグは引用元や作品のタイトル（本、記事、映画など）を示すために使われるよ。このタグの中のテキストは通常イタリックで表示されるんだ。
使用例:
<p>引用元: <cite>Franklin D. Roosevelt</cite></p>
特徴:
- インライン要素であること
- 通常、イタリックで表示されること
- 引用元や作品のタイトルを示すために使用されること
<blockquote> と <cite> の例:
<blockquote cite="https://example.com/quote-source">
"The only limit to our realization of tomorrow is our doubts of today."
<cite>— Franklin D. Roosevelt</cite>
</blockquote>
4.3 <q> エレメント
<q> タグは短い引用をテキストに埋め込むために使われるよ。ブラウザは自動的に、<q> タグで囲まれたテキストの周りに引用符をつけるんだ。
使用例:
<p>アルベルト・アインシュタインが言ったように、<q>想像力は知識よりも重要</q>。</p>
特徴:
- インライン要素であること
- 引用の周りに自動的に引用符を追加すること
- メインテキストに埋め込まれた短い引用に使用されること
<q> の cite属性:
cite 属性は <q> タグにも使用され、引用のソースURLを示すために使われるよ。
cite属性付きの例:
<p>アルベルト・アインシュタインが言ったように、<q cite="https://example.com/einstein-quote">想像力は知識よりも重要</q>。</p>
引用タグの組み合わせ使用
これらのタグは、一緒に使ってより構造化され、情報提供に富んだコンテンツを作成することができるよ。
<h1>引用タグの使用例</h1>
<p>
アルベルト・アインシュタインが言ったように、<q cite="https://example.com/einstein-quote">想像力は知識よりも重要</q>。
</p>
<blockquote cite="https://example.com/quote-source">
"The only limit to our realization of tomorrow is our doubts of today."
<cite>— Franklin D. Roosevelt</cite>
</blockquote>
<blockquote>, <cite>, <q> タグは、HTMLで引用を正しく表現するために重要なんだ。これらのタグは、視覚的な引用の際立ちと、検索エンジンや自動処理システムにとって重要なセマンティックな意味をサポートするよ。
GO TO FULL VERSION