1

表のセルの print.css ファイルに不透明度を適用しようとしています。Firefox で印刷すると、これらの不透明なセルは完全に見えなくなります。ページに他の要素があるため、[背景の色と画像を印刷する] のチェックを外して印刷します。ただし、Chrome では、特定の td セルが色あせた状態で印刷が正しく行われますが、まだ所定の位置に表示されます。

スタイルシートの参照:

<link rel="stylesheet" type="text/css" href="style.css"/>
<link type="text/css" href="print.css" rel="stylesheet" media="print" />

print.css ファイルからの関連する CSS ルール:

td.fade {
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
    filter: alpha(opacity=30);
    -webkit-opacity: 0.3;
    -moz-opacity: 0.3;
    opacity: .3;
}

すべての td 要素には以前のルールがいくつかありますが、不透明度と競合するものはありません。そして、このルールは、表のセルまたは親に適用される print.css の最後のルールです。

もう 1 つの奇妙な問題は、Firefox の印刷プレビューが正しく印刷されているかのように表示されるが、そうでないことです。print.css で不透明度を表示する際に Firefox にバグがありますか? print.css ファイルの特定のルールにより、印刷時に他のフォーム要素が表示されないため、print.css が使用されていることはわかっています。

4

3 に答える 3

1

moz-opacityは 1 つの方法であり、色に透明性を与えるアルファ値を持つrgba カラー コードの別の方法があります。

于 2013-03-24T12:30:46.483 に答える
1

Rafe はコメントでこれについて言及しましたが、なぜ彼が答えとして提供しなかったのかわかりません。色を使用rgba()すると、Firefox で色あせたテキストが印刷されます。このコードのフィドルの例:

HTML

<table>
    <tr><td>Test No Fade</td></tr>
    <tr><td>Test Fade 70%</td></tr>
    <tr><td>Test Fade 50%</td></tr>
    <tr><td>Test Fade 30%</td></tr>
</table>

CSS

tr + tr td {
    color: rgba(0,0,0,.7);
}
tr + tr + tr td {
    color: rgba(0,0,0,.5);
}
tr + tr + tr + tr td {
    color: rgba(0,0,0,.3);
}

背景の色や画像を印刷していないので、すべてのクラスで印刷メディアのテキストを に.fade切り替えることをrgba()お勧めします。color

于 2013-03-20T19:54:32.507 に答える
0

Cromeの印刷は、ページからスナップのような画像を取得してプリンターに転送する、組み込みの別のドライバーを使用して行われます。確認、PDFプリンターのインストール、ページの印刷を行います。ページは画像の形式になりますが、テキストは表示されません。選択可能。

不透明度を印刷している間。その単なるmedia="screen"効果。media = "print"では、ファイルのスプーリングは1文字ずつ（または1行ずつですが、プリンターで適用されます）行われるため、これはプリンターでは適用されません。

解決策：print.cssまたはmedia = "print"の場合、言いたいことが1つあります。

色のコントラストを下げます。border-color：＃000の場合; 不透明度0.3の場合、近くの色につながる可能性があります：＃888。

これでうまくいきます。不透明度はフィルターです。これは画面に適用され、プリンターでは機能しません。

これを読んだ後、物事が明確になることを願っています:)

ありがとうございました、

于 2013-03-19T12:06:30.740 に答える