web-dev-qa-db-ja.com

Blockquote、q、citeの正しい使用方法は?

これはBlockquoteqおよびciteの正しい使用ですか?

<p>
<blockquote>Type HTML in the textarea above, <q>and it will magically appear</q> in the frame below.
</blockquote>
<cite><a href="http://stackoverflow.com">refrence url</a>
</p>

Blockquoteqの使用は意味的に正しいですか?または両方がプレゼンテーション要素なので、使用しないでください?

53
Jitendra Vyas

はい。これらはプレゼンテーション要素ではありません。blockquoteはブロック引用を表し、qはインライン引用を表し、citeは名前、作品、標準、URLなどへの参照を表します。

いくつかの 検証エラー がありますが、これはblockquoteでかなり一般的です。 blockquote要素は段落内に置くことはできません。また、HTML4では実際にcontain段落が必要です。フラグメント内のpおよびblockquote要素のネストは逆にする必要があります。

blockquote要素(およびq要素)には、オプションでcite属性を指定して、引用元のURIを指定できます。 HTML5の発言 ユーザーエージェントshouldは、そのリンクをユーザーが利用できるようにしますが、HTML4は何も言いません。ブラウザはそれを処理しないため、cite属性とインラインリンクの両方にURIを含めます。

これらの改訂を念頭に置いて、フラグメントをどのように書くかを以下に示します。

<blockquote cite="http://stackoverflow.com">
  <p>Type HTML in the textarea above, <q>and it will magically
  appear</q> in the frame below.</p>
</blockquote>
<p>
  <cite><a href="http://stackoverflow.com">reference url</a></cite>
</p>

このフラグメントを検証する

49
Josh Lee

このページの他の回答は古くなっていますが、質問はまだ有効です。

q要素はインライン要素であり、そのように使用する必要があります(つまり、内部にブロック要素はありません)。

<p>
   In the words of <cite>Charles Bukowski</cite> -  
   <q>An intellectual says a simple thing in a hard way. 
   An artist says a hard thing in a simple way.</q>
</p>

もう一つの例:

<p>
    <q>This is correct, said Hillary.</q> is a quote from the 
    popular daytime TV drama <cite>When Ian became Hillary</cite>.
</p> 

q要素はblockquote要素内に配置しないでください。これは冗長であるため、両方とも引用符を示します。

blockquoteはブロック要素であり、他のブロック要素を内部に配置できます。

  <blockquote>
    <p>My favorite book is <cite>At Swim-Two-Birds</cite>.</p>
    - <cite>Mike Smith</cite>
  </blockquote>

<cite>はもう少し複雑です。これはインライン要素ですが、どのHTML仕様に従っているかによって異なります。 W3C は、URL、作品のタイトル(書籍のタイトル、映画のタイトルなど)、または著者の名前を含むことができることを示します。

[〜#〜] whatwg [〜#〜] は、URLまたは作品のタイトルのみを含むことができることを示すため、not人の名前。

これは有効なWHATWGの使用法です。

<figure>
 <blockquote>
  <p>The truth may be puzzling. It may take some work to grapple with.
  It may be counterintuitive. It may contradict deeply held
  prejudices. It may not be consonant with what we desperately want to
  be true. But our preferences do not determine what's true.</p>
 </blockquote>
 <figcaption>Carl Sagan, in "<cite>Wonder and Skepticism</cite>", from
 the <cite>Skeptical Inquirer</cite> Volume 19, Issue 1 (January-February
 1995)</figcaption>
</figure>
12
Chuck Le Butt

BLOCKQUOTEに類似したDIVおよびQに類似したSPANを検討できます。

推奨される使用法は、大きな引用符をBLOCKQUOTEで囲み、小さな単一行または文の引用符をQで囲むことです。

<blockquote>
    <p>This is a big quote.</p>
    <p>This is the second paragraph with a smaller <q>quote</q> inside</p>
</blockquote>

Citeはどちらか一方の属性であり、単にソースを指しているだけです。

4
Joel

citeまたはblockquoteq属性などの属性を使用しても、簡単に表示できません(JSまたはトリッキーなCSSがないため)。簡単に参照リンク。 現在は準拠していますcite(および/またはfooter)を含めるintoblockquoteは、以下のように、引用をテキストで、またはURLを介して、ソースを指定します。

<blockquote>
  <p>Beware of bugs in the above code; I have only proved it correct, not tried it.” </p>
  <cite><a href="http://www-cs-faculty.stanford.edu/~uno/faq.html">Donald Knuth: Notes on the van Emde Boas construction of priority deques: An instructive use of recursion, March 29th, 1977</a>
</blockquote>

ご了承ください :

  • (ソース参照ではなく)引用内容の一部であるciteのケースも非常にまれと見なされ、関連するciteサブタグの差別化クラスを介して処理する必要があります)

  • qに関しては、実際にインラインで引用することを目的としていますが、ブロック引用の外側で使用される可能性が高くなります(引用への引用は非常にまれです)。

3
Javarome

<cite>要素のセマンティック(および有効な)使用は、HTML5で "であってもまだ議論されています。 「

<blockquote><q>、および<cite>」に関する非常に詳細で有用な記事がここにあります。

http://html5doctor.com/blockquote-q-cite/

0
Nico Pernice

this によれば、「cite」はq-のattributeであり、その点では十分にサポートされていません。

0