blockquote 要素

4.5.4 blockquote 要素

カテゴリー
フロー・コンテンツ
セクショニング・ルート
formatBlock 候補
この要素を使うことができるコンテキスト:
フロー・コンテンツが期待される場所
コンテンツ・モデル:
フロー・コンテンツ
コンテンツ属性:
グローバル属性
cite
DOMインタフェース:
interface HTMLQuoteElement : HTMLElement {
           attribute DOMString cite;
};

HTMLQuoteElement インタフェースは q 要素でも使われます。

blockquote 要素は、他の情報源から引用されたセクションを表します。

blockquote 要素の中のコンテンツは、他の情報源から引用されなければいけません。その情報源のアドレスがあるのであれば、それを cite 属性の中で言及することができます。

cite 属性が存在するなら、それは潜在的にスペースによって囲まれた妥当な URL でなければいけません。対応する引用リンクを取得するために、その属性の値は、その要素に対して解決されなければいけません。ユーザーエージェントは、そのような引用元のリンクをユーザーがたどることができるようにするべきです。

cite IDL 属性は、その要素の cite コンテンツ属性を反映しなければいけません。

この次の例は、blockquote 要素と一緒に cite 要素を使ったものを示しています:

<p>His next piece was the aptly named <cite>Sonnet 130</cite>:</p>
<blockquote cite="http://quotes.example.org/s/sonnet130.html">
  <p>My mistress' eyes are nothing like the sun,<br>
  Coral is far more red, than her lips red,<br>
  ...

この例は、掲示板の投稿で、どのように blockquote を使うことができるのかを示しています。ユーザーがどの投稿に返信したのかがわかります。スレッドをマークアップするために、article 要素が各投稿に使われています。

<article>
 <h1><a href="http://bacon.example.com/?blog=109431">Bacon on a crowbar</a></h1>
 <article>
  <header><strong>t3yw</strong> 12 points 1 hour ago</header>
  <p>I bet a narwhal would love that.</p>
  <footer><a href="?pid=29578">permalink</a></footer>
  <article>
   <header><strong>greg</strong> 8 points 1 hour ago</header>
   <blockquote><p>I bet a narwhal would love that.</p></blockquote>
   <p>Dude narwhals don't eat bacon.</p>
   <footer><a href="?pid=29579">permalink</a></footer>
   <article>
    <header><strong>t3yw</strong> 15 points 1 hour ago</header>
    <blockquote>
     <blockquote><p>I bet a narwhal would love that.</p></blockquote>
     <p>Dude narwhals don't eat bacon.</p>
    </blockquote>
    <p>Next thing you'll be saying they don't get capes and wizard
    hats either!</p>
    <footer><a href="?pid=29580">permalink</a></footer>
    <article>
     <article>
      <header><strong>boing</strong> -5 points 1 hour ago</header>
      <p>narwhals are worse than ceiling cat</p>
      <footer><a href="?pid=29581">permalink</a></footer>
     </article>
    </article>
   </article>
  </article>
  <article>
   <header><strong>fred</strong> 1 points 23 minutes ago</header>
   <blockquote><p>I bet a narwhal would love that.</p></blockquote>
   <p>I bet they'd love to peel a banana too.</p>
   <footer><a href="?pid=29582">permalink</a></footer>
  </article>
 </article>
</article>

この例は、短い抜粋に対して blockquote を使っています。blockquote 要素の中で p 要素を使う必要がない例を示しています。

<p>He began his list of "lessons" with the following:</p>
<blockquote>One should never assume that his side of 
the issue will be recognized, let alone that it will 
be conceded to have merits.</blockquote>
<p>He continued with a number of similar points, ending with:</p>
<blockquote>Finally, one should be prepared for the threat 
of breakdown in negotiations at any given moment and not 
be cowed by the possiblity.</blockquote>
<p>We shall now discuss these points...

会話を表す方法例は後述のセクションで説明されています。この目的で citeblockquote を使うのは適切ではありません。


※ 原文:http://www.w3.org/TR/2011/WD-html5-20110525/grouping-content.html#the-blockquote-element