0

問題のサイト：http ：//www.blues-n-brews.com/paypal_receipt.php？tx = 17G30980M69737722

私はこれを持っています：

<div id="print_special" style="width: 1050px; zoom: 0.8; margin: 0 auto; text-align: center; border: 5px solid black">

そのうち、ユーザーが印刷/プレビューするときに、ズームを100％に変更して、境界線を削除したいと思います。

やっています：

@media print
{
    #print_special {
        border-style: none;
        border: 0px solid black;
        zoom: 1;
    }
}

しかし、それは思ったように機能していません。display:none;そうすると、期待どおりにdivが削除されるので、@mediaの印刷が正常に機能していることがわかります。どうした？

4

1 に答える 1

2

インラインCSSが印刷スタイルシートを上書きしています。最も簡単な方法は、@ mediaprint{}スタイルを次のように変更することです。

@media print
{
    #print_special { border: none !important; zoom: 1 } 
}

！important部分は、カスケードのさらに下で定義されたスタイルによってこの値がオーバーライドされないようにすることをブラウザーに通知します。さらに、すべてのスタイル情報をマークアップから取り出して、メディアクエリを含むCSSファイルにすべて入れることをお勧めします。これにより、カスケードの問題について心配する必要がなくなります。ただし、そうする気がない場合は、！importantを使用してください。

于 2012-07-26T18:40:45.333 に答える