blockquote要素

HTMLでは、引用文を示すことができます。

本ページでは、blockquote要素について説明します。

blockquote要素とは

blockquote要素は、引用されたセクションを示します。通常は、左に大きくインデント(余白)をとって表示されます。

blockquoteの定義は、以下のとおりです。

【blockquoteの定義】
コンテンツカテゴリ	フローコンテンツ、セクショニングルート、認知可能コンテンツ
可能な親要素	フローコンテンツを包含できる要素
可能なコンテンツ	フローコンテンツ
タグの省略	不可
DOMインターフェース	HTMLQuoteElement

以下は、blockquoteを使ったHTMLの例です。

【blockquoteの利用例】

<blockquote>
<p>ここに、引用元の文章を記述します。引用したことは明記が必要です。</p>
</blockquote>

これをブラウザで表示すると、以下になります。

左に大きくインデントがとられていることがわかります。

グローバル属性と、以下が使えます。

cite属性の利用例は、以下のとおりです。

【cite属性の利用例】

<blockquote cite="https://example.com/">
<p>ここに、引用元の文章を記述します。引用したことは明記が必要です。</p>
</blockquote>

https://example.comから引用したことを示しています。

引用を示す要素には、qもあります。qは、インラインボックスです。改行されないため、段落の途中で使えます。

blockquoteは、ブロックボックスです。必ずブロックのような四角い形を作って表示され、改行されます。また、セクショニングルートのため、ページのアウトラインに影響を与えずに、見出しを含めた引用が可能です。

各ブラウザの最新バージョンでのサポート状況は、以下のとおりです。

【パソコン】
項目	IE	Ed	Fx	Ch	Sa	Op
blockquote	〇	〇	〇	〇	〇	〇
cite	〇	〇	〇	〇	〇	〇

【スマートフォン】
項目	Sa	An	Op	Ch	Fx	Sm
blockquote	〇	〇	〇	〇	〇	〇
cite	〇	〇	〇	〇	〇	〇

※スマートフォンのFirefoxとChromeは、Android版です。