4.7　引述文本

有两个特殊的元素用以标记引述的文本。blockquote元素表示单独存在的引述（通常更长，但不一定这样），参见图4.7.1，默认显示在新的一行，参见图4.7.2。而q元素则用于短的引述，像那些句子里面的引述，参见图4.7.3。

  1. ...
  2. <body>
  3.  
  4. <p>He enjoyed this selection from <cite>The Adventures of Huckleberry Finn</cite> by Mark Twain:</p>
  5.  
  6. <blockquote cite="http://www.marktwain books.edu/the-adventures-of-huckleberry -finn/">
  7.      <p>We said there warn't no home like a raft, after all. Other places do seem so cramped up and smothery, but a raft don't. You feel mighty free and easy and comfortable on a raft.</p>
  8. </blockquote>
  9.  
  10. <p>It reminded him of his own youth exploring the county by river.</p>
  11.  
  12. </body>
  13. </html>

图4.7.1　根据需要，blockquote可长可短。可以包含cite属性（不要与第一段中出现的cite元素混淆）提供引述文本的位置。不过，浏览器不会显示cite属性中的内容，参见图4.7.2（要了解推荐的做法，参见第二条提示）

4.7　引述文本 - 图1

图4.7.2　浏览器默认对blockquote文本进行缩进。截至目前，还没有浏览器会显示cite属性的值（要了解推荐的做法，参见第二条提示）。但所有的浏览器都支持cite元素，通常对其中的文本以斜体显示，如图所示。所有这些默认样式都可以被CSS覆盖

  1. ...
  2. <body>
  3.  
  4. <p>And then she said, <q>Have you read Barbara Kingsolver's <cite>High Tide in Tucson</cite>? It's inspiring.</q></p>
  5.  
  6. <p>She tried again, this time in French: <q lang="fr">Avez-vous lu le livre <cite>High Tide in Tucson</cite> de Kingsolver? C'est inspirational.</q></p>
  7.  
  8. </body>
  9. </html>

图4.7.3　如果引述文本的语言与页面默认语言（通过html元素的lang属性指定）不同，就在q元素中加上lang属性

浏览器应对q元素中的文本自动加上特定语言的引号，但Internet Explorer直到IE8才开始支持这一特性。还有的浏览器在处理嵌套的引述时存在一些问题。一定要阅读本节提示，了解q元素的替代方法。

  1. 引述块级文本的步骤

  • 输入开始一个块级引述。

  • 如果需要，输入cite="url"，其中url为引述来源的地址。

  • 输入>以结束开始标记。

  • 输入希望引述的文本，并用段落等适当的元素包围。

  • 输入。

  1. 引述行内文本的步骤

  • 输入开始引述字词或短语。

  • 如果需要，输入cite="url"，其中url为引述来源的地址。

  • 如果引述内容的语言与页面默认语言（通过html元素的lang属性指定）不同，输入lang="xx"，其中xx是引述内容语言的两个字母的代码。这个代码用于判断需要使用的引号的类型（英语为“”，而很多欧洲语言则为«»），但浏览器对引号的呈现方式可能不同。

  • 输入>以结束开始标记。

  • 输入要引述的文本。

  • 输入。

提示　尽管这样做也是允许的，但应避免将文本直接放在blockquote开始和结束标记之间。应该将文本放在blockquote中p或其他语义上适合的元素中。

　

提示　可以对blockquote和q使用可选的cite属性，提供引述内容来源的URL。不幸的是，浏览器通常不会将cite的URL呈现给用户，参见图4.7.2，因此这个属性本身不是特别有用。因此，建议在内容中使用链接（a元素）重复这个URL，让访问者可以查看来源。也可以使用JavaScript将cite的值暴露出来，但这样做的效果稍差一些。

　

提示　blockquote元素是HTML5的区块根，这意味着它可以有h1～h6标题（及其自身的大纲），但文档大纲不会包含这些标题。这与分块内容是不一样的，参见3.4节。

　

提示　q元素引用的内容不能跨越不同的段落。

　

提示　不要仅仅因为需要在字词两端添加引号就使用q。例如，

Every time I hear the word soy, I jump for joy.

是不正确的，因为soy并不是对某参考源的引用。

　

提示　blockquote和q元素可以嵌套。例如，

The short story began, When she was a child, she would say, Howdy,stranger! to everyone she passed.

。嵌套的q元素应该自动加上正确的引用（在英语中外面的是双引号，里面的是单引号），但浏览器的支持程度并不相同。由于内外引号在不同语言中的处理方式是不一样的，因此要根据需要在q元素中加上lang属性（参见图4.7.3和图4.7.4）。

　

提示　由于q元素的跨浏览器问题（参见图4.7.4），很多（可能是大多数）开发人员避免使用q元素，而是选择直接输入正确的引号或使用字符实体。Oli Studholme在HTML5 Doctor上发表的文章“Quoting and citing with

, , , and the cite attribute”深入分析了这一话题，还提供了一些为q元素添加引号样式的方法和相关的浏览器支持信息（http://html5doctor.com/blockquote-q-cite/）。

4.7　引述文本 - 图2

图4.7.4　浏览器应该自动在q元素周围加上双引号（此外，应在嵌套的q元素周围加上单引号）。如图所示，Firefox是这样做的，但并非所有的浏览器都支持（例如旧版本的Internet Explorer）