OiO.lk Community platform!

Oio.lk is an excellent forum for developers, providing a wide range of resources, discussions, and support for those in the developer community. Join oio.lk today to connect with like-minded professionals, share insights, and stay updated on the latest trends and technologies in the development field.
  You need to log in or register to access the solved answers to this problem.
  • You have reached the maximum number of guest views allowed
  • Please register below to remove this limitation

iText HTML to PDF change background color

  • Thread starter Thread starter Nguyen Tran Nhat Vu
  • Start date Start date
N

Nguyen Tran Nhat Vu

Guest
I was trying to convert an HTML to PDF file using iText with Java. However my PDF file has an area with different color cause by tag <body> background property. The PDF file should have all-white background same as the <div class='container'> class. Is there any way to achieve it instead of changing <body> background in <style> tag to white?

enter image description here

This is my HTML and CSS

Code:
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        @page {
            margin-left: 0;
            margin-right: 0;
            margin-top: 0;

            @bottom-left {
                margin-left: 10px;
                content: "Page " counter(page) " / " counter(pages);
            }
        }

        body {
            scroll-behavior: smooth;
            color: #000;
            font-weight: normal;
            background: #f0f0f0;
            background-color: rgb(244, 180, 103);
            width: 100%;
            line-height: 20pt;
            text-align: justify;
            margin: 0 auto;
            height: 100%;
        }

        @media print {
            body {
                background-color: #fff;
            }
        }

        .container {
            scroll-behavior: smooth;
            width: 210mm;
            padding: 25mm 25mm 25mm 35mm;
            background: #FFF;
            margin: 0 auto;
            box-sizing: border-box;
            position: relative;
            font-size: 14pt;
            height: 100%;
        }
    </style>
</head>

<body>
    <div class="container">
        <h1>CONTAINER</h1>
        <p>This is my data</p>
        <p>This is my data</p>
        <p>This is my data</p>
        <p>This is my data</p>
        <p>This is my data</p>
        <p>This is my data</p>
        <p>This is my data</p>
        <p>This is my data</p>
    </div>
</body>

</html>

This is my Java code

Code:
private static final String HTML_FILE_PATH = "C:/yourlocation/input.html";
private static final String PDF_FILE_PATH = "C:/yourlocation/output.pdf";

public static void main(String[] args) throws IOException {
    System.out.println("Hello World!");

    FontProvider fontProvider = new DefaultFontProvider(true, true, true);
    ConverterProperties properties = new ConverterProperties();
    properties.setCharset("UTF-8");
    properties.setFontProvider(fontProvider);

    File htmlFile = new File(HTML_FILE_PATH);
    File pdfFile = new File(PDF_FILE_PATH);
    try (FileInputStream fStream = new FileInputStream(htmlFile)) {
        System.out.println("BEGIN to convert HTML to PDF");
        HtmlConverter.convertToPdf(fStream, new FileOutputStream(pdfFile), properties);
        System.out.println("FINISHED convert HTML to PDF");

    } catch (IOException e) {
        e.printStackTrace();
    }
}
<p>I was trying to convert an HTML to PDF file using iText with Java. However my PDF file has an area with different color cause by tag <<em>body</em>> background property. The PDF file should have all-white background same as the <<em>div class='container'</em>> class. Is there any way to achieve it instead of changing <<em>body</em>> background in <<em>style</em>> tag to white?</p>
<p><a href="https://i.sstatic.net/0k1GBloC.png" rel="nofollow noreferrer"><img src="https://i.sstatic.net/0k1GBloC.png" alt="enter image description here" /></a></p>
<p>This is my HTML and CSS
<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-html lang-html prettyprint-override"><code><!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
@page {
margin-left: 0;
margin-right: 0;
margin-top: 0;

@bottom-left {
margin-left: 10px;
content: "Page " counter(page) " / " counter(pages);
}
}

body {
scroll-behavior: smooth;
color: #000;
font-weight: normal;
background: #f0f0f0;
background-color: rgb(244, 180, 103);
width: 100%;
line-height: 20pt;
text-align: justify;
margin: 0 auto;
height: 100%;
}

@media print {
body {
background-color: #fff;
}
}

.container {
scroll-behavior: smooth;
width: 210mm;
padding: 25mm 25mm 25mm 35mm;
background: #FFF;
margin: 0 auto;
box-sizing: border-box;
position: relative;
font-size: 14pt;
height: 100%;
}
</style>
</head>

<body>
<div class="container">
<h1>CONTAINER</h1>
<p>This is my data</p>
<p>This is my data</p>
<p>This is my data</p>
<p>This is my data</p>
<p>This is my data</p>
<p>This is my data</p>
<p>This is my data</p>
<p>This is my data</p>
</div>
</body>

</html></code></pre>
</div>
</div>
</p>
<p>This is my Java code</p>
<pre><code>private static final String HTML_FILE_PATH = "C:/yourlocation/input.html";
private static final String PDF_FILE_PATH = "C:/yourlocation/output.pdf";

public static void main(String[] args) throws IOException {
System.out.println("Hello World!");

FontProvider fontProvider = new DefaultFontProvider(true, true, true);
ConverterProperties properties = new ConverterProperties();
properties.setCharset("UTF-8");
properties.setFontProvider(fontProvider);

File htmlFile = new File(HTML_FILE_PATH);
File pdfFile = new File(PDF_FILE_PATH);
try (FileInputStream fStream = new FileInputStream(htmlFile)) {
System.out.println("BEGIN to convert HTML to PDF");
HtmlConverter.convertToPdf(fStream, new FileOutputStream(pdfFile), properties);
System.out.println("FINISHED convert HTML to PDF");

} catch (IOException e) {
e.printStackTrace();
}
}
</code></pre>
Continue reading...
 

Latest posts

Online statistics

Members online
0
Guests online
5
Total visitors
5
Top