1

PrinceXML を使用して、.Net アプリケーションで PDF レポートを作成しています。レポートを HTML で作成しましたが、背景色の領域がほとんどありません。しかし、PrinceXML を使用して PDF レポートを生成すると、これらの背景色が失われます。背景色を幅と高さの背景画像に置き換えてみました。それでも表示されません。その CSS 領域を完全に削除したようなものです。

以前にこのような問題に遭遇した人はいますか? PrinceXML のドキュメントには、背景色と画像をサポートしていると記載されています。

4

3 に答える 3

2

背景色

Prince はborder-colorを認識しているようですが、 color (テキストの色) やbackground-colorbackground-imageは認識していません。

After疑似要素と太い境界線を使用して、背景色をシミュレートできます。プリンスはこれを正しくレンダリングします。

CSS

.bgRED:after {
      content: "";
      display:block;
      border-top: 25px solid red;
      margin-top: -25px;
    }
.bgRED-ib {display: inline-block;}

HTML

<p class='bgRED'>This is a p with a red background</p>
<span class='bgRED bgRED-ib span6'>This is a span with a red background</span>

これを機能させるには、要素の高さをピクセル単位で知る必要があります。

背景画像

ページ全体に背景画像の「ウォーターマーク」を作成して、同様のことを試みています

Prince は次のように CSS を無視しました: background-image: url(HUGE_sunset.jpg)

ただし、次のようなものを使用して動作させることができました。

HTML

<img class="behind" src='HUGE_sunset.jpg'>
<div class="infront">
     <p>with the lights out, it's less dangerous, here we are now entertain us </p>
</div>

CSS

.behind {position: absolute; width:100%; height:100%; z-index:1;}
.infront {position: absolute; z-index:500;}
于 2014-01-23T04:07:46.770 に答える
2

プリンスのドキュメントでは、background-colorデフォルトでtransparent、およびcolorデフォルトで に言及していますblack。気まぐれに、!importantディレクティブをcolor/background-colorスタイルに追加しようとしましたが、うまくいきました。

これらのケースで Prince がデフォルトのスタイル セレクターとして何を適用したかはわかりませんが、この不愉快な!important戦争を必要とする後に (または他のより具体的なセレクターと共に) ベース スタイルを適用するようです。

適用されたスタイルを検査する方法がないと、少し不透明です。または、別のルートに進むことをお勧めします。幸いなことに、私の場合、必要なスタイルは、Prince が生成した pdf にのみ固有のものです。Prince と Web の両方で使用する必要があるスタイルがある場合は、Prince フォーラムにバグとして投稿し、修正されることを期待することをお勧めします。

于 2016-11-28T20:24:51.670 に答える
0

これは、Prince Pdf の背景画像の css です。

<style>
@page{
          background: url(background.png) #ffffff;
          -webkit-background-size: 100%;
          prince-background-image-resolution: 72dpi;
          background-position: 0px 0px;}
</style>

ちなみに、bootstrap を使いたい場合は、バージョン 3.7 を使用してください。

于 2018-06-29T01:38:28.623 に答える