10

私のアプリケーションの 1 つは、Web ベースの POS (Point Of Sale) です。そのため、クロムで請求書を印刷しています。ページヘッダーとページフッターがブラウザーによって自動的に挿入され、ユーザーの介入なしでページを介して抑制したい..

私はいくつかのCSSを print-mediaに適用しました。

@media print {
 #header, #footer { 
    visibility: hidden !important;
    display: none !important;
 }
}

しかし、それは適用されていません。おそらくセレクターが正しくありませんか？

また、余白も減らしてみましたが、印刷に複数のページがある場合は、ページの内容を切り取ったり上書きしたりしました..そしてもう1つ、クロムの印刷プレビューオプションを無効にしたくありません..

これに対する良い解決策はありますか？

よろしくお願いします..

4

2 に答える 2

25

使用する

@page{margin:0px auto;}

あなたのcssスクリプトで。これにより、印刷時にページ レイアウトが乱れる可能性が高いため、正しいパディングで #container div を追加して、ページの見栄えを良くすることをお勧めします。Google Chrome でのみテストされています。

于 2012-10-12T08:22:13.917 に答える
-1

。。開発にどれだけ精通しているかはわかりませんが、CSSセレクターはいくつかの要素と一致する必要があります。[[ページ]「ヘッダー」と[ページ]「フッター」は、「[ウェブ]ページ」ではなく「[印刷]ページ」のように、そのようなCSSのターゲットにすることはできません。特に任意に選択した場合はそうではありません。 ID、およびおそらく自分のページIDと衝突し、ブラウザベンダーが実装を受け入れることのないID。

。。「margin：0auto;」を使用することの提案。「@page」ディレクティブは実際には正しいです（ブラウザには表示するのに十分なマージンがないため、非表示にするだけです）。問題は、現在Chromeだけが正しくサポートしていることです。他のブラウザでは、PDFを作成して印刷する以外に適切なオプションはありません。埋め込まれたJavaScriptを使用して、ロードされるとすぐに印刷ダイアログを表示する自己印刷可能なPDFを作成できますが、それはあなたが行くことができる最も遠いものだと思います。

。。幸運を。

于 2013-03-01T03:36:16.587 に答える