0

印刷する必要がある一連の HTML レポートに取り組んでいます。画面上ではすべて問題ないように見えますが、ページを印刷すると、すべてのテキスト要素が白いボックスで囲まれます。

画面上のページのスクリーンショットを次に示します。
画面上のページのスクリーンショット

以下は、システムの印刷ダイアログを使用して印刷された PDF のスクリーン ショットです。
システムの印刷ダイアログを使用して印刷された PDF のスクリーン ショット

HTMLは次のとおりです。

<!DOCTYPE html>
    <html>
        <head>
            <link rel="Stylesheet" type="text/css" href="../css/style.css" media="all"/>
        </head>
    <body>
        <div id="container">
        <div id="menu">
            <b>Menu</b><br>
            HTML<br>
            CSS<br>
            JavaScript</div>
        <div id="content">
            Content goes here</div>
    </body>
</html>

CSSは次のとおりです。

@media print
{
    /* Hides elements on page when printed */
    .nonPrinting
    {
        display: none;
    }
    /* Forces the background colors / images to display when printing */
    body
    {
        -webkit-print-color-adjust : exact;
    }
}

#container
{
    width:500px;
}

#menu
{
    background-color:#FFD700;
    height:200px;
    width:100px;
    float:left;
}
#content
{
    background-color:#EEEEEE;
    height:200px;
    width:400px;
    float:left;
}

ページは node-webkit アプリケーション内で実行されています。

4

1 に答える 1

0

これらの要素に特定の背景色を割り当ててみましたか?

試す

background-color : transparent;

また

background-color: #FFD700;

の子要素について#menu

編集

これは、「印刷された」pdfが私にとってどのように見えるかです:

パソコンでpdf

編集：

多分それはドライバーの問題ですか？

于 2013-07-24T18:11:48.090 に答える