0

ページに画像を表示し、画像の右側に文字を表示したいと考えています。
XSL-FOではどのように記述すれば宜しいでしょうか?

表示イメージ

画像画像画像 文字文字文字
画像画像画像 文字文字文字
画像画像画像 文字文字文字
文字文字文字文字文字文字

1 件の回答 1

1

このような出力は、fo:floatという要素を使うことで実現できます。
このfo:floatは通常、画像をページの先頭の別の領域に配置させたり、画像を一方の側に配置させるために使用します。
以下がfo:floatの仕様になります。
https://www.w3.org/TR/xsl/#fo_float

質問のサンプルでは、画像を左側に配置させるのが要望ですので、
fo:floatのfloat属性に"left"を指定することでfo:float内のコンテンツが左側に配置されます。

このfloat属性は、仕様を参照すると次のような値が設定できることが分かります。
before | start | end | left | right | inside | outside | none | inherit
これらは、絶対方向でも論理方向でも指定できることを示しています。

画像はfo:external-graphicで指定しますので、これをfo:float内に記述します。
https://www.w3.org/TR/xsl/#fo_external-graphic

従って例えば、

<fo:block>
  <fo:float float="left">
    <fo:block>
      <fo:external-graphic height="6em" content-height="scale-to-fit" src="url(image.png)"/>
    </fo:block>
  </fo:float>
文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字
</fo:block>

のように記述します。

fo:external-graphic のheight属性は、画像エリアの高さ、content-height属性は、画像ファイルの内容の高さを指定しています。指定している値の"scale-to-fit"は、エリアの高さ以内に収まるように、拡大・縮小することを指定しています。

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。