Widely available すべての主要ブラウザで対応済み。安心して使用可能。

<blockquote>

<blockquote> は HTML 要素で、内包する要素のテキストが引用文であることを示します。通常、字下げして表示されます（整形方法については注意の項を参照してください）。引用元の URL は cite 属性により与えることができ、引用元のテキスト表現は <cite> 要素を用いて与えることができます。

テキスト・構造

対応ブラウザ

機能 デスクトップ モバイル
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
<blockquote>
1
12
1
≤4
18
≤3.2
HTML 属性
cite
1
12
1
≤4
18
≤3.2
1+対応 (バージョン) 未対応 ※注釈あり サブ機能の解説は MDN Web Docs (CC BY-SA 2.5)

基本構文

HTML 
<blockquote cite="https://example.com/source">
  <p>The power of the Web lies in its universality.
  An essential aspect of this is that it is accessible to everyone, regardless of whether they have a disability.</p>
  <footer>— Tim Berners-Lee</footer>
</blockquote>

ライブデモ

shinpl quote

Blockquote element in partso-s from. quote display.

プレビュー全画面表示

Multiple. quotestyle

differentdesign. quoteblock.usage to compare usage.

プレビュー全画面表示

nestedquote

quote. middle to to quote nestedstructure.

プレビュー全画面表示

実務での使いどころ

  • <blockquote> の活用

    <blockquote> は HTML 要素で、内包する要素のテキストが引用文であることを示します。

注意点

  • 古いブラウザでは対応していない場合がある。

アクセシビリティ

  • スクリーンリーダーでの読み上げを確認すること。

参考リンク