Homepage-Webhilfe Event-Banner

Grafiken und Hintergrund

In diesem Thema lernen Sie, wie Sie Grafiken in Ihr Dokument integrieren und wie Sie Hintergründe festlegen.


Um eine Grafik im Dokument zu platzieren, wird das einteilige Element external-graphic verwendet. Über die Attribute content-height und content-width lässt sich die Höhe und Breite festlegen. Dabei ist es auch möglich, eines der Attribute wegzulassen. In diesem Fall wird die andere Größe automatisch berechnet, wobei das Seitenverhältnis beibehalten wird. Werden beide Attribute nicht angegeben, so wird die Originalgröße des Bilds verwendet. Die Quelle des Bilds wird als Pfadangabe über das Attribut src angegeben.

XSL-FO-Code:

<?xml version="1.0" encoding="UTF-8" ?>

<fo:root xmlns:fo="http://www.w3.org/1999/XSL/Format">
    <fo:layout-master-set>
        <fo:simple-page-master master-name="DIN-A4" page-height="297mm" page-width="210mm">
            <fo:region-body region-name="inhalt" margin="2cm" />
        </fo:simple-page-master>
    </fo:layout-master-set>
    
    <fo:page-sequence master-reference="DIN-A4">
        <fo:flow flow-name="inhalt">
            <fo:block>
                <fo:external-graphic src="../../../../Bilder/Logo/Logo.jpg" content-width="150px" content-height="150px" />
            </fo:block>
        </fo:flow>
    </fo:page-sequence>
</fo:root>
VorschauPDF:

Übrigens: Beim Transformationsvorgang durch den FO-Prozessor wird das Bild in das Dokument eingebettet. Nach der Erzeugung muss das Bild nicht mehr unter dem angegebenen Pfad existieren.


Die Hintergrundfarbe lässt sich über das Attribut background-color festlegen. Als Werte sind, so wie beim color-Attribut auch, Hex-RGB-Werte, RGB-Funktionswerte und englische Farbnamen möglich.

XSL-FO-Code:

<?xml version="1.0" encoding="UTF-8" ?>

<fo:root xmlns:fo="http://www.w3.org/1999/XSL/Format">
    <fo:layout-master-set>
        <fo:simple-page-master master-name="DIN-A4" page-height="297mm" page-width="210mm">
            <fo:region-body region-name="inhalt" margin="2cm" />
        </fo:simple-page-master>
    </fo:layout-master-set>
    
    <fo:page-sequence master-reference="DIN-A4">
        <fo:flow flow-name="inhalt">
            <fo:block-container background-color="red" width="5cm" height="2cm"><fo:block></fo:block></fo:block-container>
            <fo:block-container background-color="lime" width="5cm" height="2cm"><fo:block></fo:block></fo:block-container>
            <fo:block-container background-color="blue" width="5cm" height="2cm"><fo:block></fo:block></fo:block-container>
        </fo:flow>
    </fo:page-sequence>
</fo:root>
VorschauPDF:

Möchten Sie als Hintergrund ein Bild (z. B. für einen Farbverlauf oder ein Wasserzeichen) an Stelle einer Farbe verwenden, so können Sie das Attribut background-image einsetzen.

XSL-FO-Code:

<?xml version="1.0" encoding="UTF-8" ?>

<fo:root xmlns:fo="http://www.w3.org/1999/XSL/Format">
    <fo:layout-master-set>
        <fo:simple-page-master master-name="DIN-A4" page-height="297mm" page-width="210mm">
            <fo:region-body region-name="inhalt" margin="2cm" />
        </fo:simple-page-master>
    </fo:layout-master-set>
    
    <fo:page-sequence master-reference="DIN-A4">
        <fo:flow flow-name="inhalt">
            <fo:block-container background-image="../../../../Bilder/Logo/Logo.jpg" width="5cm" height="2cm"><fo:block></fo:block></fo:block-container>
        </fo:flow>
    </fo:page-sequence>
</fo:root>
VorschauPDF:
Um unsere Webseite für Sie optimal zu gestalten und fortlaufend verbessern zu können, verwenden wir Cookies. Durch die weitere Nutzung der Webseite stimmen Sie der Verwendung von Cookies zu. Weitere Informationen OK