电子技术论坛_中国专业的电子工程师学习交流社区-中电网技术论坛

标题: HTML 至格式化对象（FO）转换指南（6)命名锚点引用 [打印本页]

作者: look_w 时间: 2018-7-15 08:31 标题: HTML 至格式化对象（FO）转换指南（6)命名锚点引用

<h1> 至 <h6> 标题转换标题标记相对较简单；将每种标题放入 <fo:block> 元素，然后根据标题级别更改字体、字体大小和其它属性。为了使顶级标题真正突出，该示例布局在 <h1> 文本之前放置了一个分页符和一条水平线。以下是所用的格式选项：
HTML 标记字体大小行高标题后的空间其它<h1>28pt32pt22pt在文本之前添加分页符和水平线<h2>24pt28pt18pt无<h3>21pt24pt14pt无<h4>18pt21pt12pt无<h5>16pt19pt12pt文本加下划线<h6>14pt17pt12pt文本加下划线并且是斜体字
以下是一些标题元素：

1
2
3
4
5
6
7

<h1>Sample text from Henry Fielding's <cite>Tom Jones</cite></h1>
<h2><b>Book I.</b>  Containing as Much of the Birth of the Foundling
  as Is Necessary or Proper to Acquaint the Reader with in the
  Beginning of This History</h2>
<h3><b>Chapter VII.</b>  Containing Such Grave Matter, That the Reader
  Cannot Laugh Once Through the Whole Chapter, Unless Peradventure He
  Should Laugh at the Author</h3>

这些元素被转换为以下格式化对象：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

<fo:block break-before="page">
  <fo:leader leader-pattern="rule"/>
</fo:block>
<fo:block font-family="serif" space-after="22pt" keep-with-next="always"
line-height="32pt" font-size="28pt" id="tomjones">
  Sample text from Henry Fielding's
<fo:inline font-style="italic">Tom Jones</fo:inline>
</fo:block>
<fo:block font-family="serif" space-after="18pt" keep-with-next="always"
line-height="28pt" font-size="24pt" id="N10017">
  <fo:inline font-weight="bold">Book I.</fo:inline>
  Containing as Much of the Birth of the Foundling
  as Is Necessary or Proper to Acquaint the Reader with in the
  Beginning of This History
</fo:block>
<fo:block font-family="serif" space-after="14pt" keep-with-next="always"
line-height="24pt" font-size="21pt" id="N1001C">
  <fo:inline font-weight="bold">Chapter VII.</fo:inline>
  Containing Such Grave Matter, That the Reader
  Cannot Laugh Once Through the Whole Chapter, Unless Peradventure He
  Should Laugh at the Author
</fo:block>

在 <h1> 元素的文本前插入的分页符使得共同使用命名锚点和 <h1> 元素变得复杂。出于这个原因， <h1> 元素的 XSLT 模板检查前一个元素，看它是否为命名锚点。以下是 <h1> 和 <h6> 元素的模板：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50

<xsl:template match="h1">


      <fo:block break-before="page">
<fo:leader leader-pattern="rule"/>
  </fo:block>
  <fo:block font-size="28pt" line-height="32pt"


      keep-with-next="always"
   space-after="22pt" font-family="serif">
<xsl:attribute name="id">
   <xsl:choose>
      <xsl:when test="@id">
      <xsl:value-of select="@id"/>
      </xsl:when>


      <xsl:when test="name(preceding-sibling::*[1]) = 'a' and
                     preceding-sibling::*[1][@name]">
      <xsl:value-of select="preceding-sibling::*[1]/@name"/>
      </xsl:when>
      <xsl

therwise>
<xsl:value-of select="generate-id()"/>
</xsl

therwise>
   </xsl:choose>
</xsl:attribute>
<xsl:apply-templates select="*|text()"/>
  </fo:block>
</xsl:template>
<xsl:template match="h6">
  <fo:block font-size="14pt" line-height="17pt"
   keep-with-next="always" space-after="12pt"
   font-family="serif"

      font-style="italic"
   text-decoration="underline">
<xsl:attribute name="id">
   <xsl:choose>
      <xsl:when test="@id">
      <xsl:value-of select="@id"/>
      </xsl:when>
      <xsl

therwise>
<xsl:value-of select="generate-id()"/>
</xsl

therwise>
</xsl:choose>
</xsl:attribute>
<xsl:apply-templates select="*|text()"/>
</fo:block>
</xsl:template>

最后提一点：因为标题可用于书签和目录，而且它还是有用的链接点，所以最好确保每个标题都有一个 id 。如果给定的标题元素已经有 id 属性，那么就使用它；如果没有，则使用 XSLT generate-id() 函数创建一个：

1
2
3
4
5
6
7
8
9
10
11
12

<xsl:attribute name="id">
<xsl:choose>
<xsl:when test="@id">
<xsl:value-of select="@id"/>
</xsl:when>
<xsl

therwise>


      <xsl:value-of select="generate-id()"/>
</xsl

therwise>
</xsl:choose>
</xsl:attribute>

<hr> 水平线<fo:leader> 是一个特殊的 XSL-FO 元素，它被设计成用来处理水平线。以下是一些 HTML 标记：

1
2
3

<p>Here's a short paragraph.</p>
<hr/>
<p>Here's another paragraph, following a horizontal rule.</p>

表示该内容的 XSL-FO 标记类似于这样：

1
2
3
4
5
6
7
8
9

<fo:block>
  Here's a short paragraph.
</fo:block>
<fo:block>
  <fo:leader leader-pattern="rule"/>
</fo:block>
<fo:block>
  Here's another paragraph, following a horizontal rule.
</fo:block>

处理 <hr> 元素的 XSLT 模板非常简单：

1
2
3
4
5
6
7

<xsl:template match="hr">
  <fo:block>


      <fo:leader leader-pattern="rule"/>
  </fo:block>
</xsl:template>

最后提一点： leader-pattern 属性还支持 dots 和 space 值，前者通常用于目录，后者创建一个空白区域。
<i> 斜体字文本在 XSL-FO 中很容易表示 HTML <i> 元素：只需将该元素的文本放入带 font-style="italic" 属性的 <fo:inline> 中即可。下面是一个示例，它与前面演示的 <b> 元素的示例非常相似：

1	<p>Jackdaws <i>love</i> my big sphinx of quartz.</p>

使用基本的 XSL-FO 元素 <fo:block> 和 <fo:inline> 来处理以上内容：

1
2
3
4

<fo:block>
Jackdaws <fo:inline font-style="italic">love</fo:inline>
my big sphinx of quartz.
</fo:block>

<fo:block> 元素总是会引起换行，而 <fo:inline> 元素则不会。由于这个原因，所以使用 <fo:inline> 来处理 <i> 元素的内容。下面这个简单的 XSLT 模板可完成这项工作：

1
2
3
4
5
6
7

<xsl:template match="i">
  <fo:inline

      font-style="italic">
<xsl:apply-templates select="*|text()"/>
  </fo:inline>
</xsl:template>

<img> 嵌入的图像<img> 直接映射至 XSL-FO <fo:external-graphic> 元素。将 <img> 转换为 <fo:external-graphic> 之所以复杂是由于 FOP 工具不支持象 width="200" 这样的 HTML 属性； width 和 height 属性必须包括长度单位（例如 width="200px" ）。出于这个原因，可这样设置 XSLT 模板：使处理器在生成 <fo:external-graphic> 元素时检查 HTML 值。以下是模板：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34

<xsl:template match="img">
  <fo:block space-after="12pt">
<fo:external-graphic src="{@src}">
   <xsl:if test="@width">
      <xsl:attribute name="width">
      <xsl:choose>


      <xsl:when test="contains(@width, 'px')">
            <xsl:value-of select="@width"/>
         </xsl:when>
         <xsl

therwise>
<xsl:value-of select="concat(@width, 'px')"/>
</xsl

therwise>
      </xsl:choose>
      </xsl:attribute>
   </xsl:if>
   <xsl:if test="@height">
      <xsl:attribute name="height">
      <xsl:choose>


      <xsl:when test="contains(@height, 'px')">
            <xsl:value-of select="@height"/>
         </xsl:when>
         <xsl

therwise>
<xsl:value-of select="concat(@height, 'px')"/>
</xsl

therwise>
      </xsl:choose>
      </xsl:attribute>
   </xsl:if>
</fo:external-graphic>
  </fo:block>
</xsl:template>

注意：模板按原样使用 src 属性，而处理器根据需要将长度单位添加到 width 和 height 属性。

欢迎光临电子技术论坛_中国专业的电子工程师学习交流社区-中电网技术论坛 (http://bbs.eccn.com/)