XSL-FO 边界重叠图形答案

【问题标题】：XSL-FO border-overlapping graphicXSL-FO 边界重叠图形
【发布时间】：2014-03-20 11:23:07
【问题描述】：

我在 XSL-FO 中实现以下布局时遇到了一些问题：

我想我会创建一个简单的块，周围有一个纯黑色边框。然后我将图像放在该块的右上角，使其覆盖边框。最后我可以给这张图片一个左下边框。

编辑：这是我放置图像的代码。在第一个块中，我将尝试从块内放置图像，然后从块外放置第二个。

<?xml version="1.0" encoding="UTF-8"?>
<fo:root xmlns:fo="http://www.w3.org/1999/XSL/Format">
    <!-- Layout-->
    <fo:layout-master-set>
        <fo:simple-page-master master-name = "ticket_layout"
                                                page-height = "297mm"
                                                page-width = "210mm"
                                                margin-left = "10mm"
                                                margin-right = "5mm"
                                                margin-top = "10mm"
                                                margin-bottom = "10mm">

            <fo:region-body margin-bottom = "20mm" margin-top = "25mm"/>
        </fo:simple-page-master>
    </fo:layout-master-set>
    <!-- page sequence-->
    <fo:page-sequence master-reference = "ticket_layout">
        <!-- Body-->
        <fo:flow flow-name = "xsl-region-body">
        <!-- Info Image-->
            <fo:block-container position="absolute" bottom="10" left="10">
                <fo:block text-align = "right">
                    <fo:external-graphic src="url('Info_Icon.jpg')" border-left= "1pt solid black" border-bottom = "1pt solid black" content-height = "50%"/>
                </fo:block>
            </fo:block-container>
            <!-- Table-->
                <fo:table margin-top = "2mm" padding-bottom = "230mm" font-family = "Agenda" font-size = "11">
                    <fo:table-body>
                        <fo:table-row>
                            <!-- InfoBlock1-->
                            <fo:table-cell >
                                <fo:block padding-bottom= "48mm" margin-right = "1mm" margin-bottom = "1mm" border = "1pt solid black" >
                                    <!-- InfoImage-->
                                    <fo:block-container position="absolute" bottom="60" left="110">
                                        <fo:block text-align = "right">
                                            <fo:external-graphic src="url('Info_Icon.jpg')" border-left= "1pt solid black" border-bottom = "1pt solid black" content-height = "50%"/>
                                        </fo:block>
                                    </fo:block-container>
                                </fo:block>
                            </fo:table-cell>
                            <!-- InfoBlock_2-->
                            <fo:table-cell >
                                <fo:block  padding-bottom= "48mm" margin-left = "1mm" margin-bottom = "1mm" border = "1pt solid black">
                                </fo:block>
                            </fo:table-cell>
                        </fo:table-row>
                    </fo:table-body>
                </fo:table>
        </fo:flow>
    </fo:page-sequence>
</fo:root>

但我无法将图像准确地放在边框上。有没有可能？

图片链接：http://i.stack.imgur.com/9FvVr.jpg

我也欢迎其他一些建议！

【问题讨论】：

请展示一个完整的、最小的 XSL-FO 示例，其中您的问题仍然存在。这样，人们就可以实际测试您的代码。
对不起，你是对的。我更改了问题中的代码！
在我看来，将完整的结构保存为图像，然后将其用作fo:table-cell:w3.org/TR/xsl/#background-image的背景会更容易。
谢谢，我试试这个方法！
您还可以创建一个包含两列和两行的表。将第一个单元格设为“Wichtige Hinweise”单元格，第二个单元格可以写入或插入“i”。然后，创建一个跨越两列的空的第二行。根据需要设置边框。

标签： xslt xsl-fo

【解决方案1】：

在您的示例中，您将包含 {i} 图像的块放置在较大的块内。你永远不会让边界以这种方式重叠。根据定义，一个块在另一个块内。

有几种可能的解决方案：

创建一个包含 4 个单元格的表格，使用单元格边框创建边框图片
为边框线使用背景图片（外部图形或嵌入的 SVG）
使用 2 个同级块容器，其中 absolute-position="absolute" 相互重叠，一个与盒子内容，一个与 {i} 图像

【讨论】：